PHP 最 近 几 年 发 展 迅速 ， 其 最 新 版 本 已 经 是 PHP 7.0。 除 了 语言 


随 着 HTML 5、 移 动 开 发 的 兴起 ， 单 纯 语言 层面 的 开发 已 经 无 法 支持 日 新 月 异 的 新 需求 ， 所 以 掌握 PHP 就 代表 着 要 掌握 整个 PHP 相 关 技 术 体系 。 这 其 中 不 仅 包含 版 本 控制 工具 、 


进 阶 使 用 ， 还 包含 PHP 的 包 管 理工 


能 及 时 调整 架构 ， 使 得 Web 应 上 


PHP 技 术 开 发 者 已 经 越 来 越 向 
己 的 能 力 。 


本 书 根据 笔者 在 日 常 开发 工作 中 的 经 验 汇总 而 成 ， 目 的 就 是 为 了 帮助 开发 者 提升 开发 效率 并 锻炼 自身 的 学 习 能 力 。 


本 书 特色 


1. 提 供 了 大 量 有 较 高 应 


价值 的 典型 应 


全 栈 工 程 师 的 方向 发 展 ， 不 仅 要 掌握 服务 器 技术 、 前 端 页 面 编写 技术 、PHP 核 心 脚本 技术 ， 有 时 候 还 需要 提供 产品 设计 思路 。 开 发 者 应 该 把 握 这 一 机 会 ， 进 一 步 地 提升 自 


实例 ， 实 战 性 强 


本 书 在 多 个 章节 中 都 提供 了 实战 案例 ， 将 基本 原理 的 讲解 最 终 都 落实 到 了 代码 实现 上 ， 而 且 这 些 案例 会 随 着 图 


2. 提 供 了 大 部 分 案例 的 完整 源 代码 


书 内 容 的 推进 ， 不 断 地 趋 近 于 实际 工程 项 目 ， 


层面 的 升级 ，PHP 相 关 技 术 也 在 不 停 地 更 新 和 升级 ， 让 开发 者 拥有 更 多 的 选择 ， 可 以 应 对 不 同 的 挑战 。 


IDE (集成 


号 有 很 高 的 应 


书 中 大 部 分 案例 都 提供 了 完整 的 源 代码 ， 所 有 的 源 代码 都 可 免费 下 载 ， 使 读者 的 学 习 更 方便 。 对 于 没有 直接 提供 源 代码 的 例子 ， 书 中 也 提供 了 具体 的 获取 方式 。 


3. 内 容 由 浅 入 深 ， 循 序 渐进 ， 讲 解 通俗 易 懂 
本 书 按照 读者 的 


4. 内 容 全 面 ， 应 


性 强 


接受 度 来 搭建 知识 体系 ， 讲 解 由 浅 入 深 ， 循 序 渐进 ， 在 语言 表达 上 尽 最 大 可 能 地 将 学 术语 言 采 


从 语言 入 门 到 应 


5. 分 享 大 量 的 宝贵 经 验 


“ 授 之 以 鱼 ， 不 如 授 之 以 渔 ” 


实战 ， 本 书 不 仅 提供 了 PHP 关 联 技术 的 讲解 ， 还 提供 了 实战 应 


。 本 书 讲解 时 注 相 


案例 ， 具 有 很 强 的 实 


操作 细节 的 ， 可 以 帮助 读者 理解 重点 和 难点 内 容 ， 在 学 习 之 路 上 披 荆 斩 赫 。 


本 书 内 容 


第 1 篇 基础 入 门 篇 (第 1~6 


第 1 章 ”开启 PHP 职 场 之 旅 ,3 


) 


要 介绍 了 以 下 内 容 : 


(1) 选择 PHP 作 为 首选 开发 语言 的 原因 ; 


(2) 选择 合适 的 操作 系统 作为 开发 环境 ; 


(3) 养 成 良好 的 开发 习惯 ， 如 文档 编写 和 代码 规范 的 遵守 等 。 


第 2 章 虚拟 机 与 个 性 化 开发 环境 搭建 ， 主 要 介绍 了 如 何 搭 


(1) 了 解 虚拟 机 软件 的 工作 原理 ; 


(2) Vagrant 虚 拟 机 辅助 工 


的 下 载 、 安 装 和 使 用 ; 


(3) 在 Ubuntu 系统 中 搭建 Nginx、PHP 7 和 MySQL 开 发 环境 ， 同 时 安装 其 他 必要 的 开发 工具 。 


第 3 章 更 先进 的 版 本 管理 工 


(1) SVN 与 Git 的 区 别 ]; 


(2) Git 的 基本 使 


技巧 与 GitHub 入 门 ; 


高 效 的 PHP 开 发 环境 。 


方法 与 经 验 的 传递 ， 书 中 给 出 了 大 量 的 “提示 ”性 内 容 。 这 些 内 容 都 是 一 些 合金 量 很 高 的 成 功 经 验 分 享 与 易 错 


读者 能 理解 的 语言 进行 讲述 ， 让 刚 入 门 的 读者 也 容易 理解 。 


性 ， 读 者 可 以 随时 查阅 和 参考 。 


体内 容 包括 : 


(3) 版 本 管理 实战 的 一 些 技巧 ， 以 及 


第 4 章 高 效 团队 协作 ， 主 要 介绍 了 提高 团队 工作 效率 的 方法 与 工具 。 


(1) 选择 合适 的 通信 工具 ; 


(2) 任务 分 配 、 代 码 托管 和 缺陷 管理 ; 


(3) 使 


ProcessOn 实 现在 线 流程 图 绘制 ; 


(4) GitLab 管 理工 . 


Git， 主 要 介绍 了 以 下 内 容 : 


的 安装 、 使 用 和 进 阶 功能 介绍 。 


第 5 章 好 


(1) PHPStorm 常 用 快捷 键 操作 ; 


(2) 自 定义 文件 模板 和 代码 片段 ; 


(3) 方法 重 构 与 多 点 编辑 ; 


体内 容 包 括 : 


的 PHP 开 发 环境 一 一 PHPStorm， 主 要 介绍 了 当前 最 流行 的 PHP 集 成 开发 环境 一 一 PHPStorm。 除 了 介绍 常 


实例 讲解 如 何在 GitHub 上 搭建 免费 的 个 人 博客 网 站 ， 最 后 再 进一步 介绍 Git 的 相关 知识 与 操作 。 


见 的 PHP 集 成 开发 工具 外 ， 还 介绍 了 以 下 知识 点 : 


价值 和 参考 性 。 


发 环境 ) 的 


具 。 同 时 ， 为 了 寻求 比 开 发 框架 还 要 高 效 的 开发 模式 ， 本 书 介绍 的 内 容 管 理 框架 就 是 一 种 较 好 的 解决 方案 。 本 书 最 后 提供 的 案例 在 应 对 高 并 发 、 大 访问 量 压力 的 同时 ， 还 
可 以 得 到 有 效 支 撑 。 


项 总 结 ， 有 关于 理论 知识 的 ， 也 有 关于 


(4) PHP Xdebug 的 扩展 使 用 ; 


(5) 在 PHPStorm 中 集成 Xdebug 进 行 调试 。 


第 6 章 “PHP 依赖 的 自动 化 管理 工具 一 一 Composer， 主 要 介绍 了 Composer 包 管理 工具 。Composer 是 PHP 最 常用 的 第 三 方 依赖 管理 工具 ， 本 章 主 要 内 容 如 下 : 


(1) Composer 工 具 的 下 载 、 安 装 和 原理 ; 


(2) 分 别 通过 实例 操作 ， 介 绍 了 Composer 的 一 些 常用 关键 技术 。 


第 2 篇 ”框架 进 阶 篇 (第 7、8 章 ) 


第 7 章 ”响应 式 布 局 框架 


Bootstrap， 主 要 介绍 了 以 下 内 容 : 


(1) Bootstrap 前 端 框架 的 基本 使 用 技巧 ， 便 于 让 后 端 开发 者 也 可 以 快速 构建 可 用 的 前 端 页 面 ; 


(2) 基于 Bootstrap 的 后 台 模 板 样式 一 一 AdminLTE; 
(3) AdminLTE 的 安装 、 入 门 和 使 用 技巧 ; 


(4) 基于 AdminLTE 实 现 了 一 整套 后 台 管理 模板 ， 包 括 列表 和 表单 。 


第 8 章 ThinkPHP 命 令 行 操作 与 接口 开发 实战 ， 通 过 对 两 个 实例 的 学 习 ， 可 以 帮助 读者 快速 熟悉 ThinkPHP 5 的 新 特性 。 


第 3 篇 项 目 实 战 篇 (第 9~12 章 ) 


第 9 章 ”内 容 管理 框架 实战 一 一 基础 架构 、 与 菜单 管理 ， 将 带领 读者 开发 一 个 基本 的 内 容 管理 框架 。 


第 10 章 ”内容 管理 框架 实战 一 一 配置 和 权限 管理 ， 在 第 9 章 的 基础 上 继续 带领 读者 开发 和 完善 内 容 管理 框架 。 


第 11 章 “Crontab 计 划 任 务 管理 ， 介 绍 了 Linux/UNIX 系 统 上 最 常用 的 计划 任务 管理 工 Crontab。 本 章 除了 介绍 Crontab 的 基本 使 用 流程 外 ， 还 基于 内 容 管 理 框架 实现 了 在 管理 后 台 手 动 管理 计划 
任务 。 这 样 不 仅 省 去 了 直接 修改 服务 器 配置 的 麻烦 ， 还 可 以 及 时 更 改 Crontab 的 各 种 任务 状态 ， 从 而 提高 用 户 使 用 体验 。 


第 12 章 ”基于 Redis 队 列 的 商城 抢购 系统 ， 基 于 Redis 数 据 库 的 消息 订阅 与 发 布 机 制 ， 实 现 了 一 个 完整 的 商城 抢购 模型 。 完 成 本 章 的 项 目 案例 后 ， 读 者 可 以 深入 理解 异步 架构 对 提升 网 站 性 能 的 巨大 好 
处 ， 而 且 自 己 还 可 以 继续 扩展 和 提升 该 项 目 。 


本 书 源 代码 获取 方式 


本 书 涉及 的 源 代码 文件 等 配套 资源 需要 读者 自行 下 载 。 请 在 机 械 工业 出 版 社 华章 公司 的 网 站 www.hzbook.com 上 搜索 到 本 书 ， 然 后 单 击 页 面 上 的 “资料 下 载 ” 按 钮 即 可 下 载 。 


本 书 读者 对 象 
:PHP 语言 初学 者 ; 
“ PHP 初 、 中 级 工程 师 ; 
. 中 小 规模 开发 团队 的 PHP 相 关 开 发 者 ; 
“PHP 技术 小 组 负责 人 ; 
- 需要 提高 动手 能 力 的 网 站 开发 技术 人 员 ; 
“ 高 等 院 校 相 关 专 业 的 学 生 ; 


“ 培训 机 构 相 关 学 员 。 


关于 作者 


本 书 由 王 甲 临 主笔 编写 。 另 外 ， 吴 宏伟 先生 也 参与 了 本 书 的 相关 工作 ， 尤 其 在 后 期 为 本 书 做 了 大 量 的 细节 调整 。 由 于 他 一 丝 不 苟 地 逐 句 推 裔 ， 才 使 得 本 书 语义 更 加 清晰 ， 表 述 更 加 通畅 ， 内 容 更 加 通俗 
易 懂 。 在 此 表示 深 深 的 感谢 ! 


虽然 我 们 对 书 中 所 述 内 容 都 尽量 核实 ， 并 进行 了 多 次 核对 ， 但 因 写 作 时 间 和 作者 水 平 所 限 ， 书 中 可 能 还 存在 疏漏 和 错误 ， 敬 请 广大 读者 批评 、 指 正 。 联 系 我 们 请 发 E-mail 到 
hzbook2017@163.com (编辑 部 ) 和 whw010@163.com (编辑 ) 。 


王 甲 临 


第 1 篇 。 基 础 入 门 篇 


“ 第 1 章 ”开启 PHP 职 场 之 旅 


"第 2 章 ”虚拟 机 与 个 性 化 开发 环境 搭建 


“第 3 章 更 先进 的 版 本 管理 工具 一 一 Git 
“第 4 章 高 效 团队 协作 


.第 5 章 ”好 用 的 PHP 开 发 环境 一 PHPStorm 


“第 6 章 “PHP 依赖 的 自动 化 管理 工具 


Composer 


第 1 章 ”开启 PHP 职 场 之 旅 


对 于 职场 新 人 来 说 ， 从 了 解 PHP 开 发 市 场 需求 开始 ， 到 在 主流 系统 下 快速 搭建 集成 开发 环境 ， 再 到 解读 团队 合作 的 新 方法 ， 本 书 都 将 给 你 带 来 不 一 样 的 体验 和 帮助 。 本 章 主要 讲解 如 何 利用 PHP 技 术 快 
速 开 始 你 的 工作 等 内 容 。 


1.2 选择 Windows、Mac OS 还 是 Linux 


Windows 可 以 说 是 桌面 系统 的 不 二 选择 ，Linux 则 是 服务 器 市 场 的 王者 ， 而 开发 移动 端 \OS 应 用 则 必须 使 用 Mac OS 系统 。 不 同 的 操作 系统 应 


场景 不 同 ， 导 致 了 开发 者 经 常 需要 跨 操 作 系统 平台 开发 。 
1.2.1 ”PHP 跨 操作 系统 开发 


PHP 跨 平台 应 用 开发 的 场景 通常 体现 在 开发 环境 与 测试 、 应 用 环境 的 不 同上 。 例 如 ， 在 Windows 系 统 下 开发 ， 而 实际 的 应 


环境 为 Linux 操 作 系统 ， 则 有 如 下 潜在 问题 : 


“Windows 系 统 不 严格 区 分 大 小 写 ， 而 Linux 系 统 则 严格 区 分 ， 因 此 可 能 导致 代码 在 本 地 能 正常 运行 ， 而 部 署 到 线 上 就 有 可 能 出 错 。 
“ 虽然 大 部 分 PHP 扩 展 都 有 Windows 系 统 版 本 ， 安 装 起 来 也 很 简单 ， 只 需要 复制 扩展 名 为 .dl 的 动态 运行 库 文件 到 指定 目录 即 可 ,但 是 菜 些 PHP 扩 展 只 有 Linux 版 本 ， 如 Swoole 框 架 。 


“ 虽然 有 一 些 潜在 的 兼容 性 问题 ， 但 是 在 不 同 的 操作 系统 下 进行 开发 都 有 各 自 的 优势 ， 应 用 场景 不 同 ， 所 需要 的 开发 系统 环境 也 不 同 。 


1.2.2 ”Windows 操 作 系统 


对 于 桌面 平台 而 言 ，Windows 操 作 系统 依 然 是 首选 。 根 据 国外 网 站 NetMarketShare 的 统计 报告 来 看 ，Windows 操 作 系统 市 场 份额 依旧 在 90%! 以 上 。 使 用 Windows 操 作 系 统 进行 开发 工作 有 以 下 优 
势 : 


* Windows 是 很 多 人 使 用 的 第 一 个 操作 系统 ， 从 Windows 95 到 最 新 的 Windows 10， 用 户 一 直 在 使 用 。 
“ 软件 丰富 ， 各 种 集成 环境 、IDE 和 调试 工具 种 类 繁多 ， 开 发 者 总 能 找到 需要 的 那 一 个 。 
“ 系统 兼容 性 好 ， 可 以 允许 应 用 在 大 部 分 的 个 人 计算 机 上 ， 了 驱动 完善 ， 系 统 更 新 迅速 。 


“ 完美 支持 Office 办 公 套 件 ， 是 最 佳 的 办 公 生 产 力 环境 ， 没 有 之 一 。 


在 Windows 下 开发 PHP 应 用 ， 集 成 环境 推荐 WAMP 或 者 phpStudy， 在 常用 的 搜索 引擎 里 都 可 以 方便 地 获取 与 安装 。 其 中 ， 在 phpStudy 中 可 以 灵活 地 进行 非 服务 器 版 本 和 服务 器 版 本 切换 ， 如 图 1-6 所 


示 。 


才 phpStudy 2016 PHP-7.1.4-64NTS 


Nginx : 者 
MyYSQL : 


-运行 状态 ] FPhpStudy 启 停 


-提示 信息 
08:32:39 
08:32:39 
08:32:41 
08:32:41 


-运行 模式 一 一 切换 版 本 
个 系统 服务 
f 非 服务 模式 


应 用 


MySQL 管理 绢 


名 其 他 选项 菜单 


图 1-6 phpStudy 中 可 以 方便 地 切换 


1.2.3 ”Mac OS 操作 系统 


运行 模式 


自从 2007 年 苹果 公司 发 布 第 一 代 iPhone 手机 至 今 已 经 有 十 余年 。 其 间接 带动 了 Mac OS 系统 的 市 场 占有 率 ， 使 其 成 为 第 二 大 桌面 操作 系统 。 使 用 Mac OS 操作 系统 进行 PHP 应 用 开发 ， 通 常 有 以 下 优 


势 : 
* Mac OS 采用 的 是 UNIX 系 统 内核 ， 所 以 大 部 分 操作 习惯 和 Linux 操 作 系 统 类 似 。 
“ 因为 系统 相近 ， 所 以 一 些 Linux 系 统 下 的 开源 软件 和 包 等 都 有 Mac OS 版 本 。 
“ 相 比 Windows 系 统 ，Mac OS 没有 注册 表 机 制 ， 软 件 安装 和 和 印 载 更 加 简洁 。 


“" 有 好 用 的 包 管理 工具 


HomeBrew。 
:Mac OS 具有 更 好 用 的 命令 行 终端 体验 。 


在 Mac OS 上 进行 PHP 开 发 ， 快 速 搭建 PHP 集 成 环境 可 以 使 用 XAMPP 或 者 MAMP， 其 中 XAMPP 是 跨 平 台 软件 
占 ， 其 工具 包 如 图 1-7 所 示 。 


， 在 Windows 和 Linux 上 都 有 对 应 的 版 本 。 而 MAMP 集 成 工具 开发 包 则 由 Mac OS 系统 独 


MAMP PRO XAMPP 


1-7 Mac OS 上 常见 的 PHP 开 发 集成 环境 工具 包 


Linux 操 作 系 统 自 发 明之 日 起 ， 其 核心 思想 就 是 自由 和 分 享 ， 不 仅 其 平台 上 涌现 出 了 大 量 的 优秀 项 目 和 开源 软件 ，Linux 更 是 已 经 渗入 到 了 现代 社会 的 各 个 领域 ， 被 不 断 地 应 用 和 借鉴 。 例 如 ， 目 前 在 移 
动 市 场 上 占有 率 最 多 的 Android 系 统 ， 就 是 基于 Linux 内 核 开发 的 系统 。 


在 Linux 操 作 系 统 上 开发 PHP 应 用 ， 通 常 有 以 下 优势 : 


“ 可 以 完美 地 模拟 环境 ， 减 少 因为 跨 操作 系统 而 带 来 的 各 种 问题 。 
: 各 个 发 行 版 自 带 了 包 依赖 管理 工具 ， 如 Ubuntu 下 的 Apt 软 件 包 管 理工 具 ， 或 者 CentOS 下 的 Yum 软 件 包 管 理工 具 等 。 
“ 软件 的 编译 和 安装 更 加 方便 。 


" 有 丰富 且 优秀 的 开源 软件 和 工具 。 


若 需 要 在 Linux 下 进行 PHP 开 发 ， 首 选 的 开发 编辑 器 为 phpStorm， 开 发 环境 在 这 里 推荐 LNMP 集 成 环境 工具 包 (官方 网 址 是 https://Inmp.org) 。 虽 然 LN MP 集成 环境 工具 包 没有 图 形 界面 ， 只 能 在 系 
统 命令 行 下 使 用 ， 但 是 只 要 按照 提示 即 可 快速 完成 安装 。 例 如 ， 安 装 过 程 中 使 用 数字 选择 安装 哪个 版 本 的 MySQl 数 据 库 就 非常 方便 ， 如 图 1-8 所 示 。 


| 
Install 5.56 (Default) 


lnstall 6.36 
Install My 『 


[| 


lnstall MariaDB 5.5.56 
Install MariaDB 10.0.30 
Install MariaDB 10.1.23 

DO NOT Install MySQL/MariaDB 
Enter your choice (1, 2, 3, 4, 


-J ON 


1-8 通过 选择 序号 安装 MySQL 数 据 库 


安装 完成 后 的 状态 提示 也 通俗 易 懂 ， 其 安装 成 功 后 的 界面 如 图 1-9 所 示 。 


Checking 


Clean src directory... 


phpMyAdmin: http://IP/phpmyadmin/ 
phpinfo: http://IP/phpinfo.php 
Prober: http://IP/p.php 


Add VirtualHost: lnmp vhost add 


MySQL/MariaDB root password: root 


nginx (pid 17998 17989 17988) is running... 
php-fpm is runing! 
SUCCESS! MySQL running (18522) 
Active Internet connections (only servers) 
Proto Recv-Q Send-Q Address Foreign Address State 


tcp 8 | 时 要 时 LISTEN 
tcp 8 :808 0.0.0.0: LISTEN 
tcp 8 加 网 上 网 网上 LISTEN 
tcp 8 .800.0.0:22 8 - LISTEN 
tcp 8 :3386 8 LISTEN 
tcp6 8 - 二- LISTEN 
tcp6 8 ~ 人 LISTEN 
Install lnmp takes 53 minutes. 


图 1-9 ”Linux 下 常见 的 PHP 开 发 集成 环境 工具 包 安 装 成 功 


1.3 ” 养 成 良好 的 开发 习惯 一 一 多 看 与 多 写 
对 每 一 个 开发 者 来 说 ， 如 何 快速 融入 开发 团队 是 一 个 不 小 的 挑战 。 团 队 协同 开发 对 于 开发 者 的 沟通 能 力 、 技 术 能 力 与 学 习 能 力 都 有 较 高 的 要 求 。 
1.3.1 多 看 文档 


1. 阅 读 文档 


开发 团队 大 多 会 有 积累 的 技术 文档 ， 可 以 找 一 找 当 前 团队 中 是 否 有 以 下 文档 (但 不 限于 ) ， 通 读 这些 文 档 可 以 加 快 对 手 上 工作 的 理解 ， 提 高 工作 效率 。 


“编码 规范 ; 


“ 版 本 管理 工具 说 明 ; 


: 项 目 开发 经 验 总 结 ; 


“ 常用 工具 下 载 地 址 ; 


“ 项 目 数据 结构 说 明 书 


“ 开发 技术 官方 手册 ; 


“ 测试 用 例文 档 。 


当然 ， 以 上 这 些 文档 不 一 定 每 个 团队 都 有 。 你 也 可 以 通过 阅读 项 目 文件 ， 或 者 与 团队 成 员 交 流 等 方式 来 继续 了 解 项 目 情况 。 同 时 ， 通 读 各 种 技术 的 官方 文档 也 非常 必要 。 例 如 ， 如 图 1-10 所 示 为 PHP- 


FIG 官 网 已 经 通过 的 编码 规范 列表 。 


基础 编码 规范 Paul M. Jones N/A 
编码 风格 规范 Paul M. Jones N/A 
日 志 接 口 规范 Jordi Boggiano N/A 


自动 加 载 规范 Paul M. Jones Phil Sturgeon 


缓存 接口 规范 Larry Garfield Paul Dragoonis 


HTTP 消息 接口 规范 Matthew Weier O'Phinney Beau Simensen 


图 1-10 ”常见 的 PHP 编 码 规范 文档 
除了 技术 类 的 文档 ， 还 可 以 查看 需求 类 的 文档 。 需 求 类 文档 通常 有 以 下 两 种 : 
“ 产品 说 明文 档 ; 
“项目 需求 文档 。 
其 他 文档 一 般 是 企业 制度 、 保 密 协 议和 员工 晋升 规范 等 ， 也 建议 通读 ， 以 提升 对 企业 与 团队 的 进一步 了 解 。 


总 的 来 说， 一 开始 要 看 的 东西 很 多 ， 如 图 1-11 所 示 。 


N/A 
N/A 
N/A 
Larry Garfield 
Robert Hafner 


Paul M. Jones 


编码 规范 
开发 类 文档 ”| 数字 字典 
类 库 说 明 
测试 类 文档 ”测试 用 例 ”测试 工具 
下 载 


技术 文档 ee 安装 说 明 


下 载 
常用 工具 
工具 说 明 类 文档 由 安装 说 明 


团队 文档 版 本 控制 


Linux 常 见 镜像 
Vagrant Bax 


系统 镜像 


产品 说 明文 档 
项 目 需 求 文档 


需求 文档 


其 他 文档 门 | 企业 晋升 
其 他 


图 1-11 常见 团队 文档 分 类 说 明 


企业 架构 


2. 阅 读 代码 


很 多 时 候 ， 阅 读 代码 的 难度 甚至 要 高 于 编写 代码 ， 这 通常 是 因为 : 


' 不 符合 规范 的 编码 ; 
“ 不 合理 的 架构 设计 ; 

“ 风格 过 异 的 代码 风格 ; 
“ 程序 异常 ; 

' 功能 缺失 。 


另外 ， 不 熟悉 的 数据 库 结构 、 程 序 架构 和 不 明确 的 需求 ， 也 大 大 增加 了 代码 阅读 的 难度 。 


虽然 困难 重重 ,但 只 要 仔细 阅读 需求 文档 和 技术 文档 ， 同 时 基于 某 一 个 问题 或 某 一 个 模块 功能 进行 代码 调试 ， 就 可 以 提高 代码 阅读 的 效率 。 常 见 的 代码 阅读 流程 如 图 1-12 所 示 。 


13.2 多 写 代码 


牙 


图 1-12 ”常见 代码 阅读 流程 


PHP 语 言 本 身 的 语法 比较 松散 ， 稍 不 留神 ， 平 时 编码 的 时 候 就 有 可 能 写 出 “异形 ”代码 ， 这 无 形 中 提高 了 对 开发 者 的 要 求 。 所 以 在 正式 编程 之 前 ， 一 定 要 打 好 PHP 语 言 基础 ， 仔 细 阅 读 编码 规范 ， 同 时 
学 习 其 他 项 目 中 的 优秀 代码 。 在 编码 的 同时 ， 需 要 注意 以 下 几 点 。 


1. 规 范 注释 


良好 的 注释 习惯 ， 不 仅 可 以 让 别人 更 容易 读 懂 你 的 代码 ， 也 避免 出 现 “ 这 是 我 写 的 代码 么 ” ”这 样 的 疑问 。 代 码 注释 的 风格 


因 人 而 异 ， 但 只 要 结构 合理 、 通 俗 易 懂 即 可 满足 要 求 。 


除了 开发 团队 编码 规范 要 求 外 ， 注 释 一 般 可 以 分 为 文件 注释 、 类 注释 和 方法 注释 3 种 。 这 里 参考 PHPDoc 的 注释 规范 ， 它 是 一 种 注释 PHP 代 码 的 正式 标准 ， 在 IDE 中 提供 代码 完成 、 类 型 提示 和 除 错 功 


而 且 支 持 面向 对 象 和 面向 过 程 的 不 同 代码 风格 。 


下 面 是 一 个 典型 的 带 有 PHP 注 释 的 用 户 类 (User) : 


* @category PHP 

* @author dz5362 <wangjialin.bj@gmail .com> 
* Qversion Release: 1.1 
class User 

/二 

* 用 户 名 

* 

* Q@var string 

Private $username = ''; 
/** 

* 用 户 类 构造 方法 

ey 


public function _ construct () 


i 


大 大 


* 获取 用 户 姓名 

x 

* @return string 

* 

public function getUserName () 


{ 
return $this->username; 


i 


/** 
* 设置 用 户 名 


* @param string $username 用 户 名 
* Qreturn mixed 
x 


public function setUserName ($username = '') 


{ 
return $this->username = $username; 
} 
} 


从 实例 中 可 以 看 出 ， 无 论 是 类 注释 ， 还 是 方法 注释 ， 都 使 用 了 类 似 “@ 标 签名 


灵活 搭配 。PHPDoc 提 供 的 常见 注释 标签 说 明 如 表 1-1 所 示 。 


说 明 内 容 ” 的 方式 ， 对 注释 进行 描述 ， 多 个 标签 描述 行 组 成 了 注释 块 。 而 这 样 的 标签 还 有 很 多 ， 开 发 者 使 用 的 时 候 可 以 


表 1-1 


PHPDoc 提 供 的 常见 注释 标签 说 明 


标 签 


(@abstract 
(@access 


author 
@copyright 


标 签 
人 deprecated 
(@deprec 
example 
(exception 
(global 
(@ignore 
internal 


@link 


(@name 
magic 
(package 
(param 


(@return 


(see 


(since 
static 
(staticvar 
(subpackage 
(throws 
(todo 


2. 善 于 代码 重 构 


public, private or protected 


小 明 <xiaoming@qq.com> 


名 称 时 间 


实 例 
Version 
/path/to/example 


类 型 : $globalvarname 


URL 


变量 别名 


封装 包 的 名 称 
如 [$username] 用 户 名 


如 返回 bool 


如 Class Login() 


version 


说 明 
抽象 类 的 变量 和 方法 
文档 的 访问 和 使 用 权限 。@access private 表 明 这 个 文 
档 是 私有 的 
文档 作者 信息 
文档 版 权 信 息 


说 了 明 
文档 中 被 废除 的 方法 
同 @deprecated 
文档 的 外 部 保存 示例 文件 的 位 置 
文档 中 方法 抛 出 的 异常 ， 也 可 参照 @throws 
文档 中 的 全 局 变量 及 有 关 的 方法 和 函数 
忽略 文档 中 指定 的 关键 字 
开发 团队 内 部 信息 
类 似 于 license， 但 还 可 以 通过 访问 link 地 址 找到 文档 
中 更 多 的 详细 信息 
为 某 个 变量 指定 别名 
PHPDoc 兼 容 phpDocumentor 的 标签 
一 组 相关 类 、 函 数 封装 的 包 名 称 
输入 变量 含义 注释 
输出 函数 返回 结果 描述 ， 一 般 不 用 在 void〈 空 返回 结 
果 的 ) 的 函数 中 
文件 关联 的 任何 元 素 ( 全 局 变量 ， 包 括 页 面 、 类 、 也 
数 、 定 义 、 方 法 、 变 量 ) 
记录 什么 时 候 对 文档 的 哪些 部 分 进行 了 更 改 
记录 静态 类 、 方 法 
在 类 、 函 数 中 使 用 的 静态 变量 
子 版 本 
抛 出 的 寞 常 
表示 文件 未 完成 或 者 要 完善 的 地 方 


很 多 代码 在 初次 编写 的 时 候 ， 虽 然 可 以 正常 运行 ， 但 可 能 会 因为 程序 设计 不 完善 或 交付 时 间 短 等 各 种 原因 ， 导 致 性 能 低下 和 难以 阅读 等 问题 。 这 时 候 就 需要 对 这 一 部 分 代码 进行 重 构 操作 。 


重 构 代码 一 般 应 满足 以 下 几 个 目的 : 


“ 改善 程序 设计 ， 提 高 灵活 性 ; 


“ 增强 代码 阅读 性 ， 使 代码 更 易 理 解 ; 


“ 提高 性 能 ， 不 仅 程序 运行 更 快 ， 编 写 也 更 快 ; 


:减少 已 知 和 未 知 的 BUG。 


全 


重 构 代码 的 时 候 ， 可 以 着 重 注意 以 下 几 个 方法 : 


“ 提高 代码 复 用 即 ， 一 个 代码 片段 出 现 过 多 次 ， 就 可 以 考虑 封装 其 为 公共 方法 ; 


“ 采用 驼峰 法 命名 即 ， 同 样 的 方法 ， 命 名 为 getUsetName () 比 命名 为 a () 更 易于 阅读 (注意 方法 依赖 ) ; 
“ 规范 注释 。 
人 提示 : 一 定 不 要 为 了 重 构 代码 而 重 构 代 码 ， 具 体 问题 具体 分 析 。 代 码 重 构 可 以 说 是 一 门 艺术 ， 这 里 推荐 大 家 阅读 《 重 构 : 改善 既 有 代码 的 设计 》 一 书 。 


3. 文 档 编写 


在 阅读 文档 和 编写 代码 的 时 候 ， 也 可 以 自己 积累 笔记 和 文档 。 除 了 记录 项 目的 开发 配置 、 版 本 库 地 址 等 必 备 信息 外 ， 还 需要 把 常见 问题 和 经 验 记录 下 来 ， 这 样 下 次 再 遇 到 相同 的 问题 时 就 不 用 重复 寻找 
解决 方案 了 。 


常用 的 笔记 软件 如 图 1-13 所 示 。 


GG 有 道 云 笔记 OneNote 2016 


桌面 应 用 


图 1-13 ”常见 的 笔记 类 工具 


第 2 章 ”虚拟 机 与 个 性 化 开发 环境 搭建 


“ 工 欲 善 其 事 ， 必 先 利 其 器 ”。 为 了 提升 开发 效率 ， 除 了 使 用 更 加 强大 的 开发 硬件 外 ， 系 统 软件 和 开发 环境 也 同样 重要 。 本 讲解 如 何 使 用 虚拟 机 工具 安装 虚拟 系统 ， 方 便 多 系统 的 使 用 ， 同 时 借 
助 Vagrant 工 具 提升 使 用 体验 ， 最 终 打造 个 性 化 的 开发 环境 。 


2.1 单 平台 共享 多 系统 一 一 虚拟 机 


虽然 在 第 1 章 中 提 到 了 如 何在 各 个 系统 中 快速 安装 PHP 集 成 开发 环境 ， 但 若 想 真 正 地 模拟 生产 环境 ， 最 佳 的 平台 还 是 Linux 平 台 。 但 很 多 时 候 ， 因 为 软 / 硬 件 和 驱动 程序 的 原因 ， 在 PC 上 安装 Linux， 可 以 
说 是 一 个 灾难 。 那 么 有 没有 办 法 可 以 不 用 安装 其 他 操作 系统 直接 使 用 呢 ? 使 用 虚拟 机 就 是 一 个 很 好 的 解决 办 法 。 


2.1.1 虚拟 机 技术 


虚拟 机 (Virtual Machine) 简单 来 说， 就 是 在 当前 操作 系统 下 通过 虚拟 机 软件 安装 一 个 全 新 的 操作 系统 ， 而 这 两 个 操作 系统 可 以 做 到 互 不 影响 和 相对 独立 。 


虚拟 机 运作 机 制 如 图 2-1 所 示 。 


图 2-1 虚拟 机 运作 机 制 


虚拟 机 软件 中 运行 的 操作 系统 ， 被 称 为 虚拟 系统 。 它 具有 真实 系统 的 一 切 功能 ,可 以 安装 软件 和 进行 其 他 操作 ， 还 可 以 方便 地 切换 到 真实 系统 中 。 


除了 PC (个 人 计算 机 ) 系统 外 ， 虚 拟 机 技术 也 被 广泛 地 运用 到 了 云 服务 、 虚 拟 主机 上 。 例 如 比较 有 名 的 谷歌 云 、 亚 马 逊 云 和 阿里 云 等， 在 核心 技术 上 都 使 用 了 虚拟 机 技术 。 


常见 的 PC 虚拟 机 软件 有 Vmware、VirtualBox、Parallels Desktop， 如 图 2-2 所 示 。 


有 了 虚拟 机 技术 ， 就 可 以 在 常用 操作 系统 上 虚拟 出 一 个 生产 力 环境 的 虚拟 系统 。 在 虚拟 系统 里 面 进行 程序 的 开发 和 编译 ， 这 样 就 可 以 大 为 减少 因为 操作 系统 的 差异 而 导致 的 各 种 问题 。 


ViNWare’ YW 一 
ern ; 在 平 汪 Parallels Desktop for 
VMware Desktop ( 多 平台 Virtual Box ( 密 平 台 ) Ne Cr 


图 2-2 ”常见 的 虚拟 机 软件 


虽然 虚拟 机 是 一 个 很 好 的 解决 方案 ， 但 其 本 身 也 有 如 下 一 些 不 足 : 


能 都 会 比较 敏感 。 若 宿 3 


(1) 占用 真实 系统 资源 ， 对 PC 硬件 要 求 高 。 因 为 虚拟 机 本 质 上 是 一 个 应 用 软件 ， 只 要 运行 就 会 消耗 系统 资源 ， 更 不 用 说 还 要 去 虚拟 一 个 操作 系统 ， 对 硬件 中 的 CPU 性 能 、 运 行内 存 大 小 和 硬盘 空间 性 


(2) 软件 运行 速度 更 慢 。 


因为 虚拟 系统 是 通过 软件 模拟 的 方式 运行 的 ， 相 比 直接 运行 在 硬件 之 上 的 真实 系统 ， 其 性 能 只 能 是 无 限 接近 而 无 法 达到 或 者 超越 。 


机 性 能 太 弱 ， 则 虚拟 系统 体检 就 会 不 友好 。 


因此 一 些 对 性 能 敏感 的 软件 ， 不 建议 运行 在 


虚拟 机 上 ， 如 一 些 大 型 游戏 、 演 染 工具 等 ， 直 接 在 真实 系统 上 运行 才 可 以 发 挥 出 硬件 的 真实 效率 。 


2 


1 


目前 ,个 人 计算 机 的 性 能 大 部 分 都 可 以 满足 虚拟 机 运行 的 基本 要 求 。 


.2 _VirtulBox 虚 拟 机 


虽然 商业 虚拟 机 程序 性 能 更 高 ， 但 | 


1. 软 件 下 载 


在 浏览 器 访问 以 下 地 址 https://www.virtualbox.org/wiki/Downloads， 就 可 以 根据 不 同 的 操作 系统 选择 相应 的 下 载 安 装 文件 ， 如 


About 
Screenshots 
Downloads 
Documentation 
End-user docs 


Technical docs 


2. 软 件 安装 


因为 VirtualBox 免 费 开源 ， 支 持 的 系统 平台 多 ， 软 件 本 身 所 占用 的 系统 资源 少 ， 


所 以 在 这 里 选择 VirtualBox 作 为 实例 进行 讲述 。 


图 2-3 所 示 。 


DownloadVirtualBox 


Here, you will find links to VirtualBox binaries and its source code. 


VirtualBox binaries 
By downloading, you agree to the terms and conditions of the respective 


*， VirtualBox 5.1.26 platform packages. The binaries are release 
o EyWindows hosts 

E>yOS X hosts 

Linux distributions 

E> Solaris hosts 


0 
© 
o 


图 2-3 ”获取 VirtualBox 安 装 包 


以 Windows 操 作 系统 为 例 ， 所 需 的 安装 包 文件 在 单 击 网 页 上 的 Windows hosts 超 链接 后 即 可 自动 下 载 ， 下 载 完成 后 ， 双 击 扩展 名 为 .exe 的 安装 文件 即 可 开始 安装 。 


VirtualBox 的 安装 步骤 和 一 般 的 应 用 软件 没有 太 大 的 


安装 完成 的 提示 界面 和 软件 的 主 界面 如 图 


2-4 所 示 。 


区 别 ， 只 需要 按照 提示 依次 单 击 Next 按 钮 ， 进 行 下 一 步 安装 即 可 。 


荔 oracle VM virtualBox 5.1.26 Setup 


Oracle VM VirtualBox 5.1.26 
installation is complete. 


LAH Click the Finish button to exit the Setup Wizard, 


start Orade VM VirtualBox 5.1,26 after installation 


x 路 Oracle VM VirtualBox 管理 器 = 口 区 
管理 (E) 控制 (M) 帮助 (H) 
有 J y > 而 而 和 各 份 [ 示 统 快照] (8) 
新 建 (N) ”设置 (3) 清除 启动 (TD)v 
^ | 欢迎 使 用 虚拟 电脑 控制 台 ! 
| 窗口 的 左边 用 来 显示 已 生成 的 虚拟 电脑 ， 现 在 是 空 的 ， 因 为 你 还 没有 新 
| 建 任何 虚拟 电脑 . [a XS 


| 要 新 建 一 个 虚拟 电脑 ， 请 按 位 于 窗口 项 部 工具 栏 上 的 新 >。 

建 按钮 。 a 
| 你 可 以 按 F1 键 来 查看 帮助 ， 或 访问 2 
| www. virtualbox. org 查看 最 新 信息 和 新 闻 ， 


Version 5,1.26 


< Back 


Cancel 


3. 获 取 虚 拟 系统 镜像 


图 2-4 等 待 安装 完成 后 打开 VirtualBox 的 主 界面 


VirtualBox 安 装 完成 后 ， 需 要 系统 镜像 才 可 以 安装 虚拟 系统 。 在 这 里 选择 Linux 的 发 行 版 Ubuntu 作为 实例 的 安装 镜像 。Ubuntu 系 统 在 国内 有 对 中 文 支 持 更 好 的 本 地 化 的 镜像 (Ubuntu Kylin) 可 供 下 


载 ， 地 址 是 http://www.ubuntukylin.com/downloads， 在 下 载 页 面 中 找到 “银河 麒麟 社区 版 ”区 域 ， 单 击 “桌面 版 ”按钮 即 可 下 载 扩 展 名 为 .iso 的 系统 镜像 到 本 地 ， 如 图 2-5 所 示 。 


or yy 银河 鹿 鹿 ee 
优 鹿 麟 17.04 人 xm 人 aa 


i 国 3 认 下 
醒 


图 2-5 ”获取 Ubuntu Kylin 系 统 的 安装 镜像 


示 : Ubuntu Kylin 操 作 系统 分 为 桌面 版 与 服务 器 版 ， 两 者 最 主要 的 区 别 在 于 是 否 带 有 图 形 化 操作 界面 。 


如 今 攒 一 台 PC 主 机 不 需要 再 奔波 于 电脑 城 ， 只 需要 在 电 商 网 站 上 动 动 鼠 标 就 可 完成 选 购 。 同 理 ， 创 建 一 台 虚 拟 主 机 也 十 分 方便 。 


打开 VirtualBox 软 件 的 主 界面 ， 单 击 左上 角 的 “新 建 ” 按 钮 ， 随 后 在 弹出 的 对 话 框 中 ， 在 “名 称 ” 文 本 框 中 只 需要 输入 ubuntu1604，VirtualBox 会 智能 识别 需要 安装 的 是 Ubuntu， 从 而 自动 选择 系统 
类 型 和 版 本 。 单 击 “ 下 一 步 ”按钮 后 可 以 设置 虚拟 机 的 内 存 占 用 大 小 。 这 里 建议 设置 为 物理 内 存 的 一 半 ， 以 免 影响 计算 机 的 运行 速度 。 其 操作 步骤 如 图 2-6 所 示 。 


? < 

虚拟 电脑 名 称 和 系统 类 型 PR 

请 选择 新 虚拟 电脑 的 描述 名 称 及 要 安装 的 操作 系统 类 型 。 此 名 称 

将 用 于 标识 此 虚拟 电脑 。 内 存 大 小 

名 称 (0): 选择 分 配给 虚拟 电脑 的 内 存 大 小 OB) 。 

类 型 (T): |Linux ~ 建议 的 内 存 大 小 为 1024 J@。 

版 本 人: | Ubuntu (32-bit) M4 , 一 一 Bo 图 

4 了 16384 至 


专家 模式 (E) 取消 取消 


图 2-6 ”选择 系统 版 本 与 设置 虚拟 内 存 大 小 


虚拟 机 的 名 称 可 以 自 定义 ， 但 在 本 实例 中 ， 操 作 系统 类 型 需要 的 是 Linux， 发 行 版 本 为 Ubuntu (64-bit) 。 


设置 完成 虚拟 内 存 大 小 后 ， 单 击 “ 下 一 步 ”按钮 即 可 创建 虚拟 硬盘 。 虚 拟 磁盘 是 虚拟 机 安装 操作 系统 的 位 置 ， 可 以 根据 物理 机 实际 硬盘 的 大 小 合理 分 配 。 为 了 方便 操作 ， 本 实例 操作 使 用 VirtualBox 提 
供 的 默认 设置 。 


下 面 几 步 中 首先 选择 “现在 创建 虚拟 硬盘 ”， 然 后 设置 文件 类 型 、 分 配 类 型 、 文 件 位 置 与 大 小 ， 具 体 步骤 如 图 2-7 所 示 。 


虚拟 硬盘 创建 完成 后 ， 可 以 在 VirtualBox 的 主 界面 左 侧 列表 中 看 到 虚拟 主机 信息 ， 如 


所 新建 虚拟 电脑 


虚拟 硬盘 


你 可 以 添加 虚拟 硬盘 到 新 虚拟 电脑 中 。 新 建 一 个 虚拟 硬盘 
文件 或 从 列表 或 用 文件 来 图 标 从 其 他 位 置 选 择 一 个 。 


如 果 想 更 灵活 地 配置 虚拟 硬盘 ， 也 可 以 跳 过 这 一 步 ， 在 创 
建 虚拟 电脑 之 后 在 醒 置 中 设 定 。 


建议 的 硬盘 大 小 为 10. 00 6GB。 


〇 不 添加 庶 拟 硬盘 (0) 
@ 现在 创建 虚拟 硬盘 (C) 
〇 使 用 已 有 的 虚拟 硬盘 文件 (Uy) 
packer—ubuntu-16. 04-amd64-diskl.vymdk ( 兰 ~ 0 忆 


创建 | | ”取消 
? x 
所 ”创建 虚拟 硬盘 
存储 在 物理 硬盘 上 
请 选择 新 建 虚 拟 硬 盘 文件 是 应 该 为 其 使 用 而 分 配 (动态 分 配 )， 还 
是 应 该 创建 完全 分 配 (固定 分 配 ) 。 


动态 分 醒 的 虚拟 磁盘 只 是 逐渐 占用 物理 硬盘 的 空间 〈 直 至 达到 
rd. 不 过 当 其 内 部 空间 不 用 时 不 会 自动 缩减 占用 的 物 
IB。 


固定 大 小 的 虚拟 磁盘 文件 可 能 在 某 些 系统 中 要 花 很 长 时 间 来 创 
建 ， 但 它 往往 使 用 起 来 较 快 。 


@ 动态 分 配 (人) 
〇 固定 大 小 他) 


| [F#m] mk 


2-8 所 示 。 


创建 虚拟 硬盘 


虚拟 硬盘 文件 类 型 
请 选择 您 想 要 用 于 新 建 虚拟 磁盘 的 文件 类 型 。 如果 您 不 需要 其 他 
虚拟 化 软件 使 用 它 ， 您 可 以 让 此 设置 保持 不 更 改 状态 。 
@ VDI (VirtualBox 磁盘 遇 像 ) 
〇 wm 虚拟 硬盘 ) 
O 〇 wk (虚拟 机 磁盘 ) 


专家 模式 (E) | [下 一 步 如 ] | 取消 


全 创建 虚拟 硬盘 


文件 位 置 和 大 小 


请 在 下 面 的 框 中 键入 新 建 虚拟 硬盘 文件 的 名 称 ， 或 单 击 文件 夹 图 
标 来 选择 创建 文件 要 保存 到 的 文件 夹 * 


ubunutul604 [Fr 


ee 此 大 小 为 虚拟 硬盘 文件 在 实际 硬盘 中 能 用 


ve 
LA EE] 


4.00 JE 2.00 TB 


[并 |] 到 


图 2-7 创建 虚拟 机 虚拟 硬盘 步 又 


绰 Oracle VM VirtualBox 管理 器 OD 
管理 (F) ”控制 (M) ”帮助 (H) 
| 现 SE 地 - 丁 遇 面 】 国 备份 [系统 快照 ] (8) 
新 建 () ”设置 (5S) ”清除 ”启动 (T) 
呵 门 ubuntutp default 1500426... 加 常规 出 预览 
各 党 过 
a 9 名 称 : ubunutul604 
[64) ubunutul604 操作 系统 : Ubuntu (64-bit) 
全 @ 已 天 闭 国 系统 
内 存 大 小 : 2048 ] ubunutul604 
启动 顺序 : 软驱， 光驱 ， 硬 盘 
硬件 加 束 : WT 一 /ND-Y， 府 套 分 页 ， 
KVM 半 虚 拟 化 
显示 
显存 大 小 : 16 到 
远程 桌面 服务 器 : 已 禁用 
录像 : 已 禁用 
回 存 诸 
控制 器 : IDE . 
第 二 IDF 控 制 器 主 通道 : [光驱 ] 没有 盘 片 
控制 器 : SATA 
SATA 端口 0: ubunutul1604. vdi (普通 ，20. 00 GB) 
侈 声音 
主机 音频 驱动 : Windows DirectSound 
控制 芯片: ICH AC97 
-| ma 


图 2-8 查看 已 经 创建 完毕 的 虚拟 主机 信息 


人 A 提示 : 合理 对 虚拟 机 命名 可 以 更 好 地 进行 相应 管理 。 


6. 安 装 虚 拟 系统 


安装 虚拟 系统 前 需要 先 加 载 系统 镜像 。 在 VirtualBox3 


盘 、 处 理 器 、 网 络 连接 和 文件 管理 等 ， 操 作 步 骤 如 下 。 


(1) 选择 虚拟 镜像 


在 这 里 需要 选择 左 人 出“ 存储 ”菜单 ， 在 “存储 树 ” 


区 域 中 ， 发 现 选 项 “控制 器 : IDE” 提 示 “ 没 有 盘 片 ” 


EF 界面 中 使 用 鼠标 选中 ubuntu1604 虚 拟 机 ， 单 击 “设置 ”按钮 可 以 进入 虚拟 机 的 配置 页 面 。 配 置 页 


包含 了 对 虚拟 机 硬件 的 常见 配置 ， 


， 这 说 明 系 统 镜像 此 时 还 未 加 载 ， 如 


2-9 所 示 。 


其 中 包括 磁 


仿 ubunutu1604 - 设置 


| 本 
存 铺 树 (8) 属性 
个 控制 器 : IDE 分 配 光 驱 (0): 第 二 IDE 控 制 器 主 通道 


口 演示 (Live) 光 盘 (L) 


加 图 男 
引 | 


| 
4 


国 目 时 欧 曙 定 加 
并 


会 控制 器 : SATA 
ubunutul604. vdi 


Er 


BESAS 


图 2-9 查看 系统 镜像 是 否 加 载 


单 击 “ 没 有 盘 片 ”， 出 现 属性 详情 页 。 单 击 右 侧 “分配 光 驱 ” 后 的 光盘 图 标 ， 在 弹出 的 对 话 框 中 单 击 “ 选 择 一 个 虚拟 光盘 文件 ”后 ， 进 入 系统 文件 浏览 界面 ， 选 择 已 经 下 载 Ubuntu Kylin 系 统 的 1SO 镜 
像 文 件 ， 单 击 OK 按 钮 即 可 加 载 完毕 ， 如 图 2-10 所 示 。 


篇 ubunutu1604 - 设置 


存储 


存储 树 (8) 属性 

个 控制 器 : IDE 分 配 光 驱 (D) ， 第 二 IDE 控 制 器 主 通道 "|@ 
OT do dbo pi Cm 口 演示 (Live) 光 盘 忆 ) 

会 控制 器 : SATA 
ubunutul604. vdi 


3.98 GB 


: FE:\ 系 统 ISO\Kylin-4.0.2-desktop-sp*** 


加 加 信和 欧 唤 定 加 加 国力 
此 引 | 


图 2-10 ”查看 已 经 加 载 完成 的 系统 镜像 


加 载 完毕 后 ， 在 “存储 树 ”列表 中 的 “控制 器 : IDE” 下 ， 会 出 现 加 载 完成 的 系统 镜像 信息 ， 单 击 OK 按钮 可 以 返回 虚拟 机 列表 。 


(2) 启动 虚拟 机 。 


单 击 “ 启 动 ”按钮 即 可 开始 虚拟 系统 的 安装 ， 如 图 2-11 所 示 。 


Oracle VM VirtualBox 管理 器 一 口 4 
Rd 
管理 (F) ”控制 (M) ”帮助 (H) 


汪汪 中 


新 建 (0) ”设置 (5) ”清除 


起 明细 四 备份 [系统 快照 ](S) 


同 常规 加 预览 和 
] 击 ubunutul604 
PH ubunutul604 操作 系统 : Ubuntu (64-bit) 
SF @ 已 关闭 画 和 
内 存 大 小 : 2048 了 ubunutul604 


启 需 序 : 软驱， 光驱 ， 硬 盘 
单 击 启动 安装 || 重任 速 。 TY 淫 吉 页 


图 2-11 在 主 界面 启动 虚拟 系统 的 安装 


(3) 虚拟 系统 安装 


虚拟 机 随后 会 开启 一 个 Windows 窗 口 ， 模 拟 显示 器 的 显示 效果 。 此 时 系统 在 短暂 加 载 后 ， 会 出 现 Ubuntu Kylin 系 统 的 安装 界面 。 使 用 键盘 的 “| ”按键 可 以 选择 需要 的 安装 选项 ， 这 里 选择 “安装 银河 
诺 鹿 操作 系统 〈1) ”开始 虚拟 系统 的 安装 ， 如 图 2-12 所 示 。 


你 已 打开 了 自动 独占 键盘 的 选项 。 现在 当 


KYLIN 
ER7O| 周 构 


安装 银河 肚 鹿 操作 系统 (T) 


图 2-12 ”开始 安装 Ubuntu Kyin 虚 拟 系统 


(4) 虚拟 系统 语言 设置 


选择 “中 文 (简体 ) ”后 ， 单 击 “ 继 续 ” 按 钮 执行 下 一 步 安装 ， 如 图 2-13 所 示 。 


(5) 虚拟 系统 安装 类 型 


单 击 “ 继 续 ” 按 钮 执行 下 一 步 ， 因 为 本 实例 只 是 快速 安装 演示 ， 所 以 选中 “快速 安装 Kylin” 选 项 作为 安装 模式 ， 如 图 2-14 所 示 。 


本 向 导 将 帮助 您 完成 银河 鹿 饼 系统 的 安装 和 初始 化 设置 


苹 退 出 (Q) ”全 


园 外 本 少 辐 回 岂 起 傅 轩 hiat ctrl 


2-13 设置 虚拟 系统 安装 语言 


安装 类 型 


这 人 台 计算 机 似乎 没有 安装 操作 系统 。 您 准备 怎么 做 ? 


| 创建 备份 还 原 分 区 

勾 选 时 ， 则 安装 时 必须 创建 备份 还 原 分 区 ， 其 挂 载 点 为 /backup。 

| 创建 数据 盘 

勾 选 时 ， 则 安装 时 必须 创建 数据 盘 ， 其 持 载 点 为 /data， 快 速 安 装 时 数据 盘 的 大 小 为 整个 磁盘 除 掉 其 他 分 区 外 的 所 有 空间 大 小 


高 级 安装 
您 可 以 自己 创建 、 调 整 分 区 ， 或 者 为 Kylin 选择 多 个 分 区 。 


人 快速 安装 Kylin 
注意 : 这 会 格式 化 称 个 磁盘 ， 删 除 所 有 系统 里 面 的 全 部 程序 、 文 档 、 照 片 、 音 乐 和 其 他 文件 。 


| 
区 退出 (Q) 拟 后 退 (B) “| 现在 安装 (I) 


国 昌 四 人 FF 国 国 甸 多 GG 国 Niaht ctrl 


2-14 选择 快速 安装 模式 可 以 简化 安装 


(6) 虚拟 系统 磁盘 与 用 户 名 设置 


单 击 “ 现 在 安装 ”按钮 ， 进 入 下 一 步 。 此 时 系统 会 提示 是 否 将 改动 写 入 磁盘 ， 单 击 “ 继 续 ” 按 钮 后 ， 提 示 输 入 姓名 、 用 户 名 、 计 算 机 名 和 密码 ， 需 要 合理 设置 并 妥善 保管 。 操 作 步 骤 如 图 2-15 所 示 。 


您 的 姓名 :| ubunutu1604 


您 的 计算 机 名 : ubunutu16o4virtuale | © 
与 其 他 计算 机 联络 时 使 用 的 名 称 。 


选择 一 个 用 户 名 : ，ubunutu1604 | © 


选择 一 个 密码 : @@@e@e@e 


确认 您 的 安 码 : @@e@eee| 
自动 登录 


如 果 您 继续 ， 以 下 所 列 出 的 修改 内 容 将 被 写 入 磁盘 。 否 则 您 将 可 以 进行 进一步 的 手动 修改 。 〇 登录 时 需要 密码 


以 下 设备 的 分 区 表 已 被 改变 : 
SCSI3 (0,0,0) (sda) 


以 下 分 区 将 被 格式 化 : 

SCSI3 (0,0,0) (sda) 设备 上 的 第 1 分 区 将 被 设置 为 ext4 
SCSI3 (0,0,0) (sda) 设备 上 的 第 2 分 区 将 袖 设 置 为 ext4 
SCSI3 (0,0,0) (sda) 设备 上 的 第 5 分 区 将 被 设置 为 swap 


2-15 设置 虚拟 系统 的 基本 信息 


(7) 虚拟 系统 安装 完毕 与 使 用 


单 击 “ 继 续 ” 按 钮 后 ， 等 待 系统 安装 完毕 就 可 以 体验 和 使 用 Ubuntu Kylin 系 统 了 ， 如 图 2-16 所 示 。 


a 


.ey 
IKYLIN 
名 苛 贾 枉 


欢迎 使 用 银河 麒麟 桌面 操作 系统 


银河 麒 枉 桌面 操作 系统 面向 政府 办 公 、 企 业 应 用 、 定 制 开发 等 
桌面 使 用 需求 。 具 有 广泛 的 软 硬 件 兼容 和 便捷 的 操作 界面 ; 支 
持 金山 国产 办 公 套 件 、 常 见 桌面 应 用 ; 能 有 效 防御 病毒 、 木 马 
和 黑客 攻击 。 


+ 正在 完成 文件 复制 … 
本 | “vbunutu1604@ubunut... 


图 2-16 ”完成 虚拟 系统 的 安装 


2.2 ”虚拟 机 辅助 工具 一 一 Vagrant 


使 用 虚拟 机 的 目的 是 为 了 打造 一 个 通用 的 、 接 近 生产 力 服务 器 的 开发 环境 ， 避 免 “在 我 的 机 器 上 可 以 ， 在 你 的 机 器 上 为 什么 不 行 ? ”这 样 的 问题 出 现 。 但 由 2.1 节 可 知 ，VirtualBox 安 装 虚拟 系统 的 过 程 
和 配置 相对 烦琐 ， 对 没 接触 过 虚拟 机 工具 的 新 人 ， 在 使 用 上 并 不 算 友 好 ， 只 适合 一 些 特定 的 应 用 场景 。 而 使 用 Vagrant 工 具 可 以 让 虚拟 机 的 安装 和 配置 大 为 简化 ， 并 能 优化 系统 占用 资源 ， 最 终 提高 开发 效 


2.2.1 Vagrant 简介 


Vagrant 出 现 的 目的 是 为 了 让 开发 者 更 好 地 使 用 虚拟 机 ， 避 免 其 陷入 无 尽 的 安装 、 配 置 和 调试 之 中 。 虽 然 对 于 初学 者 来 说 ， 安 装 和 配置 虚拟 机 看 起 来 也 不 是 那么 复杂 ， 但 当 遇 到 需要 搭建 服务 器 集群 、 
端口 转发 、 多 平台 文件 共享 和 虚拟 系统 性 能 等 复杂 操作 的 时 候 ， 就 不 是 简单 地 执行 “下 一 步 ” 操 作 就 可 以 了 ， 此 时 Vagrant 这 样 的 工具 就 体现 出 价值 了 。 


VACRANT 


图 2-17 虚拟 机 辅助 工具 Vagrant 的 标志 


Vagrant 的 标志 如 图 2-17 所 示 。 


La 


Vagrant 简 单 来 说 就 是 把 在 虚拟 机 中 安装 系统 等 相关 操作 自动 化 ， 开 发 者 只 需要 通过 一 些 命令 ， 就 可 以 完成 跨 平 台 通用 开发 环境 的 搭建 和 使 用 。 其 优势 如 下 : 


“ 软件 安装 流程 简单 ， 操 作 界面 友好 。 

“ 虚拟 机 操作 自动 化 。 和 解决 安 装 初始 化 、 文 件 同 步 、SSH 远 程 连接 和 环境 依赖 等 常见 问题 。 

“ 跨 操 作 系 统 ， 支 持 多 种 虚拟 机 平台 。 无 论 开发 者 使 用 的 是 Windows 下 的 Virtual Box， 还 是 Mac OS 下 的 Vmware，Vagrant 都 可 以 完美 支持 。 
“ 方便 共享 。 虚 拟 机 环境 搭建 完成 后 支持 一 键 导 出 ， 方 便 开发 团队 共享 相同 的 开发 环境 。 


“ 开源 社区 提供 各 式 各 样 的 操作 系统 版 本 和 集成 环境 ， 无 须 再 去 寻找 各 种 版 本 的 操作 和 工具 ， 可 以 实现 一 键 下 载 、 安 装 。 


下 面 来 看 一 下 Vagrant 工 具 的 安装 流程 ， 其 具体 流程 如 下 : 
(1) 安装 VirtualBox 


因为 VirtualBox 的 详细 安装 流程 在 2.1 节 中 已 经 讲解 过 ， 这 部 分 就 不 再 赣 述 。 


(2) 下 载 Vagrant 工 具 安装 包 


访问 https://www.vagrantup.com/downloads.html， 根 据 操作 系统 版 本 下 载 安 装 文件 ， 在 这 里 选择 Windows64 位 版 本 ， 单 击 “64-bit” 按 钮 即 可 开始 下 载 ， 如 图 2-18 所 示 。 


国 国 Windows 


EN 


(3) 开始 安装 Vagrant 工 


图 2-18 选择 下 载 64-bit 版 本 的 Vagrant 工 具 安装 包 


双击 打开 下 载 完 成 的 .exe 安 装 包 ， 只 需要 单 击 Next 按 钮 一 步 一 步 地 安装 即 可 。 


Vagrant 工 ， 


安装 完成 ， 如 图 


注意 除了 安装 路 径 一 般 不 选择 系统 盘 外 ， 其 他 都 使 用 默认 设置 即 可 。 


2-19 所 示 。 安 装 完毕 后 需要 重启 系统 ， 提 示 如 图 


过 Vagrant Setup 


2-20 所 示 。 


Completed the Vagrant Setup Wizard 


Click the Finish button to exit the Setup Wizard, 


2-19 在 Windows 系 统 中 安装 Vagrant 工 具 


洁 Vagrant Setup 


You must restart your system for the configuration 
changes made to Vagrant to take effect, Click Yes to 
restart now or No if you plan to manually restart later, 


图 2-20 ” Vagrant 工具 安装 完成 后 重启 操作 系统 


(4) 开始 使 


查看 Vagrant 是 否 安装 成 功 ， 需 要 在 Windows 系 统 “ 开 始 ” 按 钮 上 单 击 鼠 标 右键 ， 然 后 选择 “命令 提示 符 (管理 员 ) (A) ”选项 后 ， 出 现 命令 行 窗口 ， 输 入 以 下 命令 : 


Vagrant 一 V 


若 正 常 显示 版 本 信息 ， 则 说 明 Vagrant 工 具 已 经 安装 成 功 ， 效 果 如 图 2-21 所 示 。 


YaEgLTant 


LC: \WINDOWS \system32>vagrant 


Yagrant 1.9.3 


图 2-21 查看 Vagrant 工 具 的 版 本 信息 


人 提示: 这 里 使 用 的 操作 系统 版 本 为 Windows 10， 在 其 他 Windows 系 统 中 打开 命令 行 工具 可 能 稍 有 不 同 。 


2.2.2 ” Vagrant 常用 操作 


Vagrant 工 具 的 方便 之 处 就 在 于 ， 可 以 直接 下 载 已 经 打包 好 的 虚拟 机 初始 化 文件 (box) 。 省 去 了 自己 下 载 系统 镜像 、 安 装配 置 的 过 程 。 相 比 传统 的 虚拟 机 系统 安装 流程 ， 使 用 Vagrant 工 具 的 相关 操作 
大 为 简化 ， 如 图 2-22 所 示 。 


传统 方式 安装 虚拟 系统 


使 用 Vagrant 工 具 安 装 虚拟 系统 
使 用 命令 自动 获取 下 载 


虚拟 系统 初始 化 文件 


图 2-22 使 用 传统 方式 与 使 用 Vagrant 工 具 安装 虚拟 系统 的 对 比 流 程 图 


Vagrant 工 具 的 box 是 一 个 操作 系统 环境 ， 实 际 上 就 是 一 个 压缩 包 ， 包 含 了 Vagrant 的 配置 信息 和 VirtualBox 的 虚拟 机 镜像 文件 。 


box 的 下 载 可 以 通过 多 种 方式 ， 这 里 推荐 使 用 官方 的 Vagrant Cloud (地 址 是 https://app.vagra 


查询 结果 如 图 2-23 所 示 ， 可 以 看 到 其 覆盖 了 常见 的 Ubuntu 操作 系统 发 行 版 本 。 


itup.comybo 


xes/search) 进行 获取 ， 方 便 检索 自己 所 需 的 box 版 本 。 以 检索 关键 字 Ubuntu 为 例 ， 部 分 


ubuntu 


Provider EE virtualbox vmware 


© 
人 


© 


libvirt | morev 


Ubuntu/trusty64 20170803.0.0 
Official Ubuntu Server 14.04 LTS (Trusty Tahr) builds 


hashicorp/precise64 1.1.0 
A standard Ubuntu 12.04 LTS 64-bit box. 


ubuntu/xenial64 20170803.0.0 
Official Ubuntu 16.04 LTS (Xenial Xerus) Daily Build 


Virtualbox 


[ee] 
vimware_fusion 


virtualbox 


Q 


Sort by Recently Created | Recently Updated | 


Downloads Released 
29,868,508 about 5 hours ago 
Downloads Released 
6,594,002 over 3 years ago 
Downloads Released 
2,760,604 4 days ago 


图 2-23 在 Vagrant Cloud 中 在 线 检索 操作 系统 压缩 包 box 


这 里 选 


(1) box 获 取 与 安装 


添加 box 的 命令 格式 如 下 : 


以 基于 Ubuntu 16.04 LTS 为 基础 的 “ubuntu/xenial64” 作 为 box 实 例 进行 下 载 、 安 装 和 启动 等 操作 方法 的 演示 。 


vagrant box add base 远 端 的 pox 地 址 或 者 本 地 的 box 文 件 名 


命令 中 vagrant box add 是 添加 box 的 命令 ，base 是 box 的 名 称 ， 可 以 自 定义 。 这 里 默认 使 F 


首先 打开 Windows 命 令 行 界面 ， 输 入 并 执行 以 下 命令 : 


base， 主 要 


来 标识 添加 的 box， 方 便 后 面 的 安装 。 


vagrant box add ubuntu/xenial64 


因为 是 官方 的 box， 所 以 在 这 里 不 定义 标识 ， 


Vagrant 会 自动 开始 下 载 box 到 本 地 ， 


nialb64 


Loading metadata for box ubuntu/xenialbd4 


URL: https://atls 
Adding box ubuntu/xenialb 


Vasesra 
+ 市 


box: successfully added box 


irtualbox | 


自动 使 用 官方 的 原名 即 可 。 下 载 完成 结果 如 


4 


Fite 1 oud. ov ubunt us E 


名 工 已 S: 


imat 


图 


2-24 所 示 。 


] 


.hashicorp. com ubuntuyxenialbd 
(wv20170803 


.0.0) for provider: virt 


xenialbd/ver 


rtualbox. box 
3 Estimted time remaining: --: 
Estimated time remainineg: 


40 bl : 33 


timated time remainine.: 


6 Py 本 


d time remainin 


ed tim Treminine. ~ nom 


ubuntu/ xenialb4 


2-24 ”下载 官方 的 “ubuntu/xenial64” 镜 像 box 


当 命令 行 提示 以 下 字样 的 时 候 ， 说 明 box 已 经 下 载 完成 : 


box: Successfully added box"box 名 ' (版 本 号 ) for virtualbox’ 


执行 以 下 命令 ， 查 看 当前 系统 中 已 经 添加 的 box 列 表 : 


vagrant box list 


此 命令 用 来 查看 Vagrant 中 已 经 添加 的 box 列 表 ， 此 时 可 以 看 到 名 为 “ubuntu/xenial64” 的 box 已 经 添加 ， 后 面 就 可 以 直接 安装 使 用 了 ， 如 图 2-25 所 示 。 


(virtualt 

(virtualt 

(virtualtk 
Ll 
b 


20170803. 0. 0) 


ubuntulb0dserver lvirtualt 
ubunutul804 (virtual 


2-25 ”查看 Vagrant 已 经 添加 的 box 列 表 


(2) 创建 虚拟 机 系统 配置 文件 


初始 化 的 过 程 也 是 使 用 命令 操作 ， 首 先 定位 到 指定 的 目录 (如 D 盘 下 的 ubuntubox 目 录 ， 开 发 者 可 以 灵活 定义 ) ， 执 行 以 下 命令 : 


vagrant init ubuntu/xenial164 


Vagrant 会 在 当前 目录 下 生成 Vagrantfile 配 置 文件 ， 用 文本 编辑 器 打开 后 ， 会 发 现 里 面 有 很 多 配置 项 ， 但 这 不 影响 使 用 默认 配置 来 完成 安装 ， 后 面 还 会 详细 说 明 此 配置 文件 。 执 行 完毕 后 的 提示 如 图 2- 
26 所 示 。 


国 选择 管理 员 : 命令 提示 符 一 口 XxX 


‘ubuntubox 
:\Ubuntubox vagrs Ubuntuy xenialb4d 


Yagrantfile | : ed in this directory. You are now 
vagrant up yo first virtual environment! Pl 


the comments in the Vagrantfile as well as documentation oc 


vagrantup. com for more information on usinge Vagrant. 


2-26 ”创建 Vagrant 虚 拟 系 统 配置 文件 


(3) 初始 化 虚拟 机 


执行 以 下 命令 : 


vagrant up 


初始 化 过 程 如 图 2-27 所 示 。 


with“ virtualbox”provider. . . 
Importing b x ubuntuAxenial64 ... 
tching MA ; for NAT networking... 
cking if + "ubuntuyxenial64 is up to date... 
tting the name of the WII: ubuntubox default 1502163611243 8: 


ed : 


(host) (ladapter 1) 
VN customizations... 
" machine to 't. This may take a few mnutes... 


wy AI 


: Remote connection disconmnect. Retrying... 
. ic key YW 
: Removir from the 8 i ba 
: Key 1 n i ew SSH key 
: Machine booted an 
cking for guest addit s in YM... 
st addit S is YM do not match the installed version of 
In most cases but in rare cases it can 

such ed fo rking pro If you see 

P re ne additions mthin the 


est Additions Version: 

: VirtualB ion: 5 

t: Mounting shared folders... 
=> D: /ubuntubox 


): \ubuntubox 


图 2-27 在 Vagrant 中 初始 化 虚拟 机 


(4) 连接 虚拟 机 
完成 虚拟 机 的 初始 化 后 ， 就 可 以 执行 相应 的 命令 进行 SSH 连 接 : 


vagrant ssh 


命令 执行 效果 如 图 2-28 所 示 。 


D: ubuntubox>vagrant 
xecutable not found in any directories in the %PATH% variable. ls an 
client installed? Try installineg JIney or Git, all of which 
contain an SSH client. Or use your favorite SSH client with the following 
authentication information 


站 


ygWw1in, 


shown below: 


Ubuntu 
D:/ubuntubox/. vagrant/machines/default/virtualbox/private key 


:AUbuntubox 


图 2-28 Windows 命 令 行 无 法 执行 SSH 操 作 


从 执行 结果 可 以 看 出 ，Windows 原 生 的 命令 行 工具 不 支持 SSH 操 作 ， 所 以 在 这 里 可 以 使 用 XShell、Git Bash 等 第 三 方 工具 进行 操作 连接 。 


更 换 第 三 方 工具 前 ， 需 要 先 在 Windows 命 令 行 工具 下 执行 关闭 虚拟 机 操作 : 


vagrant halt 


随后 打开 Git Bash 命 令 行 工具 (安装 完 Windows Git 工 具 后 ， 任 意 目 录 下 ， 在 系统 右键 菜单 中 可 以 找到 ) ， 再 次 执行 vagrant up 命令 启动 虚拟 机 。 随 后 使 用 vagrant ssh 命 令 连接 虚拟 机 ， 连 接 成 功 后 就 


可 以 操作 虚拟 机 系统 了 ， 如 图 2-29 所 示 。 


$ vagrant ssh 
Welcome to Ubuntu 16.64.3 LTS (GNU/Linux 4.4.0-89-generic x86 64) 


* Documentation: https://help.ubuntu.com 
* Management: https://landscape.canonical.com 
* Support: https://ubuntu.com/advantage 


Get cloud support with Ubuntu Advantage Cloud Guest: 
http://www.ubuntu.com/business/services/cloud 


0 packages can be updated. 
0 updates are security updates. 


ubuntuQubuntu-xenial:~$ 
图 2-29 ”使 用 SSH 成 功 连接 Vagrant 虚 拟 机 系统 
提示: Vagrant 工具 下 的 唐 拟 系统 一 般 使 用 命令 行 操作 ， 不 使 用 图 形 化 界面 。 


(5) 查看 虚拟 机 基本 信息 


执行 Linux 下 的 df-f 命 令 可 以 查看 磁盘 挂 载 信 息 ， 其 中 vagrant 目 录 映 射 真 实 系统 中 Vagrantfile 配 置 文件 所 在 的 目录 ， 可 以 实现 虚拟 系统 与 真实 系统 的 文件 共享 ， 便 于 程序 在 虚拟 机 中 调试 ， 如 图 2-30 所 


引 


ubuntu@ubuntu-xenial:~$ df -h 
Filesystem Size Used Avail Use% Mounted on 
490M 0 490M 0% /dev 
100M 3.1M 97M 4% /run 
PAT ele Ry € / 
497M 497M 86% /dev/shm 
5 .OM 5.0M 6% /run/lock 
497M 497M 8@% /sys/fs/cgroup 
60G 18G /vagrant 
106M 106M 6% /run/user/108060 


2-30 ”查看 Vagrant 应 拟 系统 的 共享 文件 天 


Vagrant 没 有 图 形 化 的 操作 ， 使 用 命令 行 和 配置 文件 来 配置 虚拟 机 的 网 络 、 文 件 和 其 他 设置 。 这 种 形式 简化 了 配置 流程 ， 也 减少 了 配置 错误 的 发 生 。 


直接 使 用 虚拟 


机 软件 ， 参 数 配置 非常 烦琐 ， 而 Vagrant 只 需要 通过 修改 Vagrantfile 文 件 ， 就 可 以 快捷 地 配置 虚拟 机 的 网 络 设 定 、 共 享 文件 位 置 等 。Vagrant 常 用 的 配置 项 及 其 说 明 如 表 2-1 所 示 。 


表 2-1 Vagrant 常 用 配置 项 及 其 说 明 


配 置 项 说 明 
config.vm.box = "ubuntu/xenial64" 初始 化 安 钱 的 box 名 称 
是 否 开启 box 的 自动 升级 ， 默 认 关 闭 。 也 可 以 手动 执行 命令 
"vagrant box outdated 实现 相同 的 效果 
config.vm.network "forwarded port"， | 网 络 端口 转发 映射 ， 将 宿主 机 的 80 端 口 转发 映射 到 虚拟 机 的 
guest: 80, host: 8080 8080 端 口 


UL oor | 设置 虚拟 机 网 络 为 Host-Only 主机 模式 )。 此 时 虚拟 机 和 宿主 
con gym.nenWwor mWarqee_por ， | 机 网 络 相互 独立 ， 需 要 手动 设置 虚拟 机 的 网 络 IP 地 址 。 注 意 设 
guest: 80, host: 8080 置 时 不 要 和 宿主 机 网 段 冲突 


设置 虚拟 机 网 络 为 Bridge( 桥 接 模式 ) 。 此 时 虚拟 机 模拟 成 为 


config.vm.box_check update = false 


config.vm.network "public_network" 一 台 物 理 机 ， 与 宿主 机 访问 同一 个 路 由 ， 共 享 同一 个 网 络 
config.vm.synced folder "../data", 同步 目录 设置 。 第 一 个 参数 设置 宿主 机 目录 ， 第 二 个 参数 对 应 
"vagrant data" 虚拟 机 系统 的 目录 


不 过 很 多 时 候 ， 开 发 者 会 使 用 虚拟 机 搭建 集群 测试 应 用 ， 所 以 Vagrant 也 提供 了 批量 配置 虚拟 机 的 方法 。 这 里 以 三 台 服务 器 的 简单 集群 架构 为 例 ， 快 速配 置 三 台 虚 拟 机 系统 ， 如 图 2-31 所 示 。 


Nginx 虚 拟 机 


Redis 虚 拟 机 MySQL 虚 拟 机 


2-31 简单 的 服务 器 集群 架构 


具体 的 操作 步骤 如 下 : 
(1) 手动 创建 配置 文件 


在 指定 目录 (实例 所 在 目录 为 D: \ubuntumuti) 下 手动 创建 Vagrantfile 文 件 ， 添 加 配置 代码 如 下 : 


# 三 个 虚拟 机 的 配置 
Vagrant .configure ("2") do |configl 
# 虚拟 机 一 : Nginx 虚 拟 机 配 配置 
hs vm.define :nginx do lnginx| 
nginx.vm.provider "virtualbox" do |v| 
lk 从 信人 工具 VBoxManage， 执 行 modifyvm 命 令 设 置 主机 名 
ul 


Customize ["modifyvm", :id, "--name", "nginx", "--memory", 
"1024"] 


end 
# 设置 box 名 
nginx.vm.box = "ubuntu/xenial64" 
圭 机 名， 

.vm. 
下 2 
nginx.vm.network :private network, ip: "192.168.33.21" 
# “ 甘 闭 自动 二 新 


Re wm.box check update = false 


ft 本 Redis 虚 拟 机 配置 


= "nginx™ 


config.vm.define :redis do |redis| 
redis.vm.provider "virtualbox" do |v| 


# 使 用 VirtualBox 的 命令 行 工具 VBoxManage， 执 行 mhodifyvm 命 令 设置 主机 名 和 内 存 大 小 
Vv.customize ["modifyvm", :id, "--name", "redis", "--memory", 
"1024"] 

end 

# 设置 box 名 

redis.vm.box = "ubuntu/xenial164" 

# 设置 主机 名 

redis.vm.hostname = "redis" 


# 设置 网 络 及 IP 地 址 
redis.vm.network :private network, ip: "192.168.33.22" 
# 关闭 自动 更 新 


config.vm.box check update = false 


end 
# 虚拟 机 三 : MySQL 虚拟 机 配置 
config.vm.define :mysql do |mysql| 
mysql .vm.provider "virtualbox" do |v| 
# 使 用 VirtualBox 的 命令 行 工具 VBoxManage， 执 行 mhodifyvm 命 令 设置 主机 名 


和 内 存 大 小 
Vv.customize ["modifyvm", :id, "--name", "mysql", "--memory", 
"1024"] 

end 

# 设置 box 名 

mysql.vm.box = "ubuntu/xenial64" 

# 设置 主机 名 

mysql .vm.hostname = "mysql" 

# 设置 网 络 及 IP 地 址 

mysql .vm.network :private network, ip: "192.168.33.23" 

# 关闭 自动 更 新 

config.vm.box_check update = false 

end 


(2) 启动 批量 安装 


保存 Vagrantfile 配 置 文件 后 ， 在 当前 目录 下 ， 打 开 Git Bash 工 具 并 执行 vagrant up 命令 ， 预 先 配置 好 的 三 台 虚 拟 机 会 自动 开始 安装 ， 效 果 如 图 2-32 所 示 。 


Administrator@Qwangjialin-pc /d/ubuntumuti 
p vagrant up 
Bringing machine “nginx” up with ‘virtualbox" provider... 
Bringing machine “redis” up with ‘virtualbox" provider... 
Bringing machine ‘mysql' up with “virtualbox” provider... 
nginx: Setting the name of the VM: ubuntumuti nginx 1502332842976 31151 
nginx: Clearing any previously set network interfaces... 
nginx: Preparing network interfaces based on configuration... 
nginx: Adapter 1: nat 
nginx: Adapter 2: hostonly 
nginx: Forwarding ports... 
nginx: 22 (guest) => 2222 (host) (adapter 1) 
nginx: Running ‘pre-boot' VM customizations... 
nginx: Booting VM... 
nginx: Waiting for machine to boot. This may take a few minutes... 
nginx: SSH address: 127.0.0.1:2222 
nginx: SSH username: ubuntu 
nginx: SSH auth method: password 
nginx: Warning: Remote connection disconnect. Retrying... 


图 2-32 ”批量 配置 与 安装 Vagrant 虚 拟 机 


从 提示: Vagrantfle 也 可 以 通过 编写 循环 语句 的 方式 配置 多 台 虚 所 机， 这 样 更 加 高 效 。 


(3) 连接 使 用 虚拟 机 系统 


安装 完成 后 测试 任意 一 台 虚 拟 机 是 否 安装 成 功 ， 进 入 Vagrantfile 配 置 文件 所 在 的 目录 ，SSH 连 接 hostname 名 为 redis 的 虚拟 机 ， 操 作 命令 如 下 : 


vagrant ssh redis 


连接 成 功 的 结果 如 图 2-33 所 示 。 


Administrator@wangjialin-pc /d/ubuntumuti 
$ vagrant ssh redis 
Welcome to Ubuntu 16.04.3 LTS (GNU/Linux 4.4.0-89-generic x86 64) 


* Documentation: https://help.ubuntu.com 
* Management: https://landscape.canonical.com 
* Support: https://ubuntu.com/advantage 


Get cloud support with Ubuntu Advantage Cloud Guest: 


http://www.ubuntu.com/business/services/cloud 


9 packages can be updated. 
6 updates are security updates . 


ubuntuQredis:~$ 


图 2-33 ”成 功 连接 代号 为 redis 的 虚拟 机 系统 


虽然 前 面 已 经 使 用 过 很 多 Vagrant 命 令 ， 这 里 还 是 把 最 常用 的 命令 总 结 成 表 ， 如 表 2-2 所 示 。 


表 2-2 Vagrant 工 具 常用 命令 说 明 


命 令 说 明 
vagrant init 初始 化 
vagrant up 启动 虚拟 机 
vagrant halt 关闭 虚拟 机 
vagrant reload 重启 虚拟 机 
vagrant ssh SSH 至 虚拟 机 
vagrant status 查看 虚拟 机 运行 状态 
vagrant destroy 销毁 当前 虚拟 机 
vagrant suspend 挂 起 当前 虚拟 机 
vagrant resume 恢复 被 挂 起 的 vm 
vagrant box list 列 出 所 有 box 列 表 
vagrant box remove {base name} 删除 box 
vagrant destroy 停止 当前 正在 运行 的 虚拟 机 并 销毁 所 有 创建 的 资源 
vagrant package 把 当前 运行 的 虚拟 机 环境 进行 打包 ， 可 用 于 分 发 开发 环境 
vagrant plugin 安装 / 印 载 插件 
vagrant provision 设置 基本 的 环境 ， 进 一 步 设 置 可 以 使 用 Chef/Puppet 进 行 搭建 
vagrant ssh-config 输出 SSH 连 接 的 一 些 信 息 
vagrant status 获取 虚拟 机 状态 
vagrant version 获取 Vagrant 的 版 本 


这 里 需要 说 明 一 下 vagrant plugin 指 令 ， 因 为 VirtualBox 设 置 共享 目录 时 需要 在 虚拟 机 中 安装 VirtualBox Guest Additions 模 块 ， 虽然 Vagrant 会 
VirtualBox 的 内 核 模块 ， 当 VirtualBox 的 内 核 升级 之 后 ，VirtualBox Guest Additions 会 失效 ， 导 致 共享 目录 挂 载 失败 。 


动 安装 ,但 是 


为 VirtualBox Guest Additions 是 


而 安装 Vagrant 插 件 vagrant-vbguest 可 以 解决 这 个 问题 ， 因 为 该 插件 会 在 虚拟 机 内 核 升级 之 后 重新 安装 VirtualBox Guest Additions。 需 要 执行 如 下 命令 : 


vagrant Plugin install vagrant-vbguest 


执行 命令 安装 完成 后 ， 效 果 如 图 2-34 所 示 。 


Administrator@wangjialin-pc 


/d/ubuntumuti 


$ vagrant plugin install vagrant-vbguest 


Installing the ‘vagrant-vbguest" plugin. This can take a few minutes... 
Installed the plugin “vagrant-vbguest (0.14.2)"! 


图 2-34 ”通过 安装 插件 解决 共享 文件 夹 失败 的 问题 


2.3 ”打造 个 性 化 开发 环境 


无 论 使 用 VirtualBox 还 是 Vagrant 工 具 搭建 虚拟 机 ， 都 只 是 提供 了 一 个 基础 的 操作 系统 环境 。 此 环境 虽然 已 经 接近 或 者 达到 应 用 环境 的 要 求 ， 但 还 需要 继续 安装 相关 的 软件 才 可 以 运行 应 用 程序 。 


在 2.2 节 中 已 经 介绍 了 如 何 安装 集成 环境 ， 这 种 方法 可 以 满足 一 般 的 基础 开发 ， 但 对 一 些 定制 化 要 求 比较 高 的 应 


作 的 方式 可 能 都 不 同 ， 不 熟悉 的 开发 者 往往 会 在 这 里 耗费 大 量 的 时 间 和 精力 。 


基于 上 述 需求 ， 本 节 将 讲解 如 何 借助 Ubuntu 系统 自 带 的 apt 包 管理 工具 ， 一 步 一 步 地 打造 个 性 化 的 开发 环境 。 


2.3.1 ”准备 工作 


在 本 地 搭建 了 以 Ubuntu 16.04 为 基础 的 虚拟 系统 后 ， 一 般 会 更 新 蔡 换 apt 包 管理 工具 的 源 为 国 
样 的 服务 ， 这 里 以 阿里 云 为 例 ， 讲 解 如 何 快速 蔡 换 apt 包 管理 工具 的 源 。 


来 说 ， 灵 活性 就 大 打折 扣 。 例 如 ， 想 继续 安装 一 些 PHP 的 扩展 ， 这 时 候 每 个 集成 环境 操 


内 的 镜像 ， 这 样 在 安装 软件 包 的 时 候 网 络 下 载 速度 会 更 快 。 国 内 很 多 互联 网 巨头 或 者 知名 大 学 都 提供 了 这 


首先 要 养 成 备份 配置 文件 的 好 习惯 ， 这 样 才能 在 文件 被 错误 修改 或 丢失 后 快速 找 回 。 操 作 步 骤 如 下 。 


(1) 备份 配置 文件 


先 执行 以 下 命令 : 


sudo cp /etc/apt/sources.list /etc/apt/sources.list.old 


(2) 新 增 国内 源 地 址 


随后 编辑 sources.list 文 件 : 


sudo vim /etc/apt/sources.1ist 


在 Vim 编 辑 器 中 输入 “: %d” 可 以 清楚 所 有 的 内 容 ， 随 后 输入 以 下 内 容 : 


#deb cdrom: [Ubuntu 16.04 LTS Xenial Xerus_ - Release amd64 (20160420.1)]/ 
xenial main restricted 

deb-src http://archive.ubuntu.com/ubuntu xenial main restricted #Added by 
software-properties 

deb http://mirrors.aliyun.com/ubuntu/ xenial main restricted 

deb-src http://mirrors.aliyun.com/ubuntu/ xenial main restricted 
multiverse universe #Added by software-properties 

deb http://mirrors.aliyun.com/ubuntu/ xenial-updates main restricted 
deb-src http://mirrors.aliyun.com/ubuntu/ xenial-updates main restricted 
multiverse universe #Added by software-properties 

deb http://mirrors.aliyun.com/ubuntu/ xenial universe 

deb http://mirrors.aliyun.com/ubuntu/ xenial-updates universe 

deb http://mirrors.aliyun.com/ubuntu/ xenial multiverse 

deb http://mirrors.aliyun.com/ubuntu/ xenial-updates multiverse 

deb http://mirrors.aliyun.com/ubuntu/ xenial-backports main restricted 
universe multiverse 

deb-src http://mirrors.aliyun.com/ubuntu/ xenial-backports main 
restricted universe multiverse #Added by software-properties 

deb http://archive.canonical.com/ubuntu xenial partner 

deb-src http://archive.canonical.com/ubuntu xenial partner 

deb http://mirrors.aliyun.com/ubuntu/ xenial-security main restricted 
deb-src http://mirrors.aliyun.com/ubuntu/ xenial-security main restricted 
multiverse universe #Added by software-properties 

deb http://mirrors.aliyun.com/ubuntu/ xenial-security universe 

deb http://mirrors.aliyun.com/ubuntu/ xenial-security multiverse 


保存 完成 后 ， 就 可 以 执行 apt 包 管理 工具 的 更 新 操作 : 


sudo apt-get update 


人 提示: apt 包 管理 工具 的 更 新 操作 所 需 的 时 间 ， 会 因为 当前 的 网 络 和 系统 版 本 等 存在 差异 。 


2.3.2 安装 及 配置 Nginx 


最 近 几 年 ，Nginx 服 务 器 以 免费 开源 和 灵活 高 效 的 特点 ， 正 在 迅速 抢占 服务 器 市 场 。 根 据 国 外 W3Techs.com 网 站 截止 2017 年 7 月 的 数据 统计 ，Nginx 的 市 场 份额 稳 


而 且 其 份额 也 处 于 不 断 增长 中 。 


2017 年 7 月 服务 器 软件 市 场 占有 排名 和 新 增 站 点 数 ， 如 图 2-35 所 示 。 


居 第 二 ， 排 名 仅 次 于 老大 哥 Apache， 


change since 
1 July 2017 


-0.4% 
+0.6% 
-0.2% 
+0.1% 
Ue 


usage 
49.1% 
34.6% 
11.0% 
2.9% 
1.1% 


m 


. Apache 


. Nginx 

. Microsoft-IIS 

. LiteSpeed 

. Google Servers 


sites 
1,490 


W3Techs.com 
. Nginx 

. LiteSpeed 60 
. Apache Traffic Server 48 


daily number of additional sites 
in the top 10 million 


percentages of sites 


图 2-35 服务 器 软件 市 场 占有 率 和 新 增 站 点 数 统计 


Nginx 构 建 Web 服 务 ， 相 比 Apache 有 以 下 几 点 优势 : 


“ 轻 量 级 。 同 样 是 Web 服 务 ，Nginx 比 Apache 占 用 系统 资源 更 低 。 


“ 并 发 性 能 高 。Nginx 请 求 处 理 是 异步 非 阻塞 型 ， 而 Apache 是 阻塞 型 的 ， 在 高 并 发 下 Nginx 能 保持 低 资 源 、 低 消耗 、 高 性 能 。 


:高度 模 块 化 的 设计 ， 灵 活 的 扩展 性 。 


除了 以 上 几 点 外 ，Nginx 和 Apache 处 理 PHP 脚 本 的 方式 也 不 尽 相 同 。Apache 是 通过 
解释 器 到 Apache 进 程 中 ， 只 支持 Apache， 而 PHP-FPM 以 独立 进程 的 形式 出 现 ， 只 要 对 应 


总 的 来 说 ，Nginx 只 有 在 需要 的 时 候 才 会 去 找 PHP (PHP-FPM) ， 而 Apache 无 论 何 时 


2-36 所 示 。 


PHP、 HTML、 JavaScript、 
CSS 等 请 


Apache 模 块 


mode php 
(无 论 请 求 类 型 ， 
都 会 常 驻 内 存 ) 


图 2-36 


A 


身 的 模块 mod_php 来 解析 PHP， 而 Nginx 则 是 通过 PHP-FPM (FastCGI) 来 解析 PHP。mod_php 通 过 嵌入 PHP 
的 Web 服 务 器 实现 CGI 或 者 FastCGI 协 议 ， 就 能 够 处 理 PHP 请 求 。 


都 需要 PHP 随 时 待命 ( 常 驻 内 存 ) ， 可 见 Nginx 效 率 要 高 一 些 。 两 种 服务 器 对 PHP 请 求 处 理 与 解析 的 不 同方 式 如 


PHP、 HTML、 JavaScript、 
CSS 等 请 求 


其 他 类 型 
请 求 处 理 


PHP-FPM 
( 仅 处 理 PHP 相 关 请求 ) 


ache 与 Nginx 解 析 PHP 的 不 同方 式 


继续 看 如 何在 Ubuntu 上 安装 Nginx， 


体 步骤 如 下 。 


在 简 和 


H 


了 解 了 Nginx 服 务 器 的 解析 原理 后 ， 下 | 


(1) 执行 命令 安装 Nginx 


AN 


这 号 


即 可 : 


还 是 使 


apt 包 的 相关 命 


sudo apt-get install -~y nginx 


动 编 


其 中 ， 参 数 “-y” 代 表 直接 执行 命令 ， 无 须 再 确认 。 执 行 后 ，apt 包 管理 工 


相关 的 依赖 ， 这 种 方式 虽然 灵活 性 不 如 手动 编译 安装 ， 但 是 相 比 集成 环境 包 ， 效 率 已 经 提高 


译 安装 Nginx 软 件 和 


了 很 多 ， 同 时 也 不 会 让 安装 过 程 过 于 烦琐 ， 后 续 的 升级 、 印 载 都 十 分 方便 。 


(2) 查看 Nginx 版 本 号 


安装 完毕 后 ， 执 行 以 下 命令 查看 Nginx 的 版 本 号 : 


nginx -v 


效果 如 图 2-37 所 示 。 


ubuntu@ubuntu-xenial: /etc/apt$ nginx -V 


nginx version: nginx/1.10.3 (Ubuntu ) 
ubuntu@Qubuntu-xenial: /etc/apt®$ 


图 2-37 查看 Nginx 的 版 本 号 


(3) 启动 Nginx 


随后 执行 以 下 命令 启动 Nginx: 


sudo /etc/init.d/nginx start 


可 以 看 到 系统 提示 Nginx 已 经 启动 成 功 ， 如 图 2-38 所 示 。 
ubuntu@ubuntu-xenial:/etc/apt$ sudo /etc/init.d/nginx start 
[ ] Starting nginx (via Systemct1l1): nginx.service. 
ubuntuf@Qubuntu-xenial: 


图 2-38 ”启动 Nginx 系 统 服务 


(4) 访问 Nginx 页 下 


随后 在 浏览 器 中 访问 http://192.168.33.20 (虚拟 机 系统 配置 的 IP 地 址 ) ， 界 面 如 图 2-39 所 示 ， 说 明 Nginx 已 经 正常 工作 。 


Welcome to nginx! 


If you see this page, the nginx web server is successfully installed and 
working. Further configuration is required. 


For online documentation and support please refer to nginx.org. 
Commercial support is available at nginx.com. 


Thank you for using nginx. 
图 2-39 ”在 浏览 器 中 查看 Nginx 服 务 状态 
人 提示 : Apache 与 Nginx 在 不 同 的 应 用 领域 各 有 优 劣 ， 需 要 根据 实际 需求 选择 。 


2.3.3 ”安装 及 配置 PHP 


发 方式 。 不 过 apt 包 管理 工具 中 可 以 安装 的 PHP 版 本 不 一 定 是 最 新 的 ， 所 以 需要 使 用 以 下 命令 查看 当前 可 以 安装 的 PHP 版 本 : 


PHP 7 版 本 的 发 布 不 仅 带 来 了 性 能 上 的 巨大 提升 ， 也 提供 了 更 高 效 的 


sudo apt-cache search php 


2-40 所 示 ， 可 以 看 到 在 当前 系统 下 ， 可 以 安装 的 最 高 版 本 为 PHP 7.0.x。 虽 然 目前 PHP 的 开发 版 已 经 到 了 7.2.x， 但 是 最 新 的 不 一 定 是 最 好 的 ， 开 发 版 本 除了 稳定 性 、 兼 容 性 不 如 稳定 版 


执行 结果 如 图 
本 ， 支 持 的 第 三 方 扩展 往往 也 达 不 到 生产 力 环境 的 需求 。 所 以 这 里 选择 目前 最 稳定 的 PHP 7.0 版 本 进行 安装 。 


0 - Server-side，HTML-embedded scripting language (metapackage ) 
.0-cgi - server-side, HTML-embedded scripting language (CGI binary) 
0-cli - command-line interpreter for the PHP scripting language 
.0-common - documentation, examples and common module for PHP 


-curl - CURL module for PHP 

.0-dev - Files for PHP7.0 module development 
.0-gd - GD module for PHP 

.9O-gmp - GMP module for PHP 


图 2-40 使 用 apt 工 具 查找 可 以 安装 的 PHP 软 件 包 


为 Nginx 需 要 依赖 PHP-FPM 才 能 顺利 地 解析 PHP 脚 本 程序 ， 所 以 除了 安装 PHP， 还 需要 安装 PHP-FPM。 安 装 流程 如 下 。 


(1) 安装 PHP 


内 行 命令 如 下 : 


sudo apt-get install -y php7.0 php7.0-fpm 


安装 完成 后 ， 会 发 现 apt 自 动 创建 了 一 些 配置 文件 ， 如 图 2-41 所 示 。 


Creating config file /etc/php/7.8/cli/php.ini with new version 
Setting up php7.0-fpm (7.0.22-0ubuntu6.16.04.1) 


Creating config file /etc/php/7.0/fpm/php.ini with new version 
Setting up php7.6 (7.0.22-0ubuntu6.16.04.1) 

Processing triggers for Systemd (229-4ubuntu19 ) 

Processing triggers for ureadahead (6.100.0-19) ... 


图 2-41 安装 PHP 相 关 包 生成 的 配置 文件 


(2) 查看 PHP 版 本 号 


查看 PHP 是 否 安装 成 功 ， 可 以 使 用 以 下 命令 查看 PHP 版 本 号 : 


php -Vv 


执行 后 可 以 看 到 当前 的 版 本 号 如 图 2-42 所 示 。 


ubuntu@ubuntu-xenial:~$ php -v 
PHP 7.0.22-0ubuntu6.16.64.1 (cli) ( NTS ) 
Copyright (c) 1997-2617 The PHP Group 


Zend Engine v3.0.0，Copyright (c) 1998-2017 Zend Technologies 
with Zend OPcache v7.0.22-Qubuntu8.16.64.1, Copyright (c) 1999-2017，by Zend Technologies 


图 2-42 在 系统 中 查看 PHP 的 版 本 号 
(3) 配置 PHP-FPM 


随后 需要 配置 PHP-FPM ， 才 能 让 Nginx 可 以 与 之 搭配 工作 。 首 先 修改 Nginx 默 认 的 配置 ， 以 增加 对 PHP 的 支持 ， 找 到 并 编辑 /etc/nginx/sites-available/default 文 件 ， 修 改 以 下 配置 代码 ， 以 实现 
Nginx 对 index.php 文 件 的 支持 : 


# Add index.php to the list if you are using PHP 
index index.html index.htm index.nginx-debian.html index.php; 


随后 在 同一 个 文件 中 修改 以 下 代码 ， 以 实现 Nginx 对 PHP-FPM 的 支持 : 


location ~ \.php$ { 

include snippets/fastcgi-php.conf; 

# With php7.0-cgi alone: 

# fastcgi pass 127.0.0.1:9000; 

# With php7.0-fpm: 

fastcgi pass unix:/run/php/php7.0-fpm.sock; 
} 


这 里 需要 注意 ， 配 置 PHP-FPM 的 版 本 号 一 定 要 与 已 安装 的 版 本 保持 一 致 ，Nginx 默 认 的 配置 项 里 面 的 PHP 版 本 一 般 会 比较 新 ， 如 默认 为 PHP 7.1。 


(4) 检测 Nginx 配 置 文件 


保存 文件 后 ， 使 用 以 下 命令 检测 配置 是 否 正 确 : 


sudo nginx -t 


通过 检测 的 效果 ， 如 图 2-43 所 示 。 


Qubuntu-xenial:~$ sudo nginx -t 
"nginx: the configuration file /etc/nginx/nginx.conf syntax is ok 


nginx: configuration file /etc/nginx/nginx.conf test is successful 


图 2-43 ”使 用 Nginx 自 带 命令 检测 配置 是 否 正确 


配置 完成 Nginx 后 ， 还 需要 确保 /etc/php/7.0/fpm/pool.d/www.conf 文 件 中 ， 以 下 配置 项 没有 被 注释 ， 如 图 2-44 所 示 。 


(5) 


由 | 


晶 启 Nginx 与 PHP-FPM 


重 载 Nginx 配 置 文件 并 重启 PHP-FPM ， 让 配置 生效 。 命 令 分 别 如 下 : 


sudo nginx -s reload 
sudo /etc/init.d/php7.0-fpm restart 


/path/to/unix/socket’ - to listen on 
Note: This value is mandatory. 


listen = /run/php/php7.0-fpm.sock 


Set listen(2) backlog. 


图 2-44 ”修改 PHP-FPM 文 件 实现 对 Nginx 的 支持 


(6) 查看 PHP 探 针 信息 


在 目录 /var/www/html 下 新 增 phpinfo.php 脚 本 文件 ， 增 加 内 容 如 下 : 


<?php 
Phpinfo (); 


保存 文件 后 ， 在 浏览 器 中 访问 http://192.168.33.20/phpinfo.php， 可 以 看 到 PHP 相 关 信 息 ， 说 明 Nginx 已 经 可 以 成 功 解析 PHP 脚 本 文件 ， 如 图 2-45 所 示 。 


PHP Version 7.0.22-0ubuntu0.16.04.1 


System | Linux ubuntu-xenial 4.4.0-89-generic #112-Ubuntu SMP Mon Jul 31 19:38:41 UTC 2017 x86 64 
Server API | FPM/FastCGI 
| Virtual Directory Support | 
| Configuration File (php.ini) Path | /etc/php/7.0/fpm 

Loaded Configuration File /etc/php/7.0/fpm/php.ini 

Scan this dir for additional .ini files | /etc/php/7.0/fpm/conf.d 


图 2-45 在 网 页 中 显示 PHP 的 系统 信息 


公 提 示 : apt 包 管理 工具 自动 安装 的 软件 版 本 会 不 定期 更 新 ， 本 书 中 安装 的 PHP 版 本 为 7.0.22。 


2.3.4 “安装 及 配置 MySQL 


MySQL 由 于 其 性 能 高 、 成 本 低 、 可 靠 性 好 ， 已 经 成 为 最 流行 的 开源 数据 库 ， 因 此 被 广泛 地 应 用 在 互联 网 上 的 中 小 型 网 站 中 ， 而 PHP 也 同样 适合 这 些 网 站 ， 所 以 常见 的 LAMP 组 合 或 者 LINMP 组 合 中 的 
M ， 就 是 指 MySQL。 


但 是 MySQL 自 从 被 甲骨 文公 司 收购 后 ， 商 业 版 本 的 授权 费用 也 大 为 上 涨 ， 所 以 在 使 用 MySQL 的 时 候 可 以 考虑 
讨论 了 ， 有 兴趣 的 读者 可 以 在 网 上 查阅 相关 资料 。 


新 的 开源 社区 分 支 MariaDB。MariaDB 的 使 用 方式 与 MySQL 差 别 不 大 ， 在 这 里 就 不 深入 


这 里 还 是 使 用 apt 包 管理 工具 快速 安装 MySQL， 安 装 步 又 如 下 。 


(1) 执行 以 下 命令 安装 MySQL 


sudo apt-get install -~y mysql-server mysql-client php7.0-mysql 


命令 中 不 仅 安装 了 MySQL 的 服务 端 、 客 户 端 ， 还 安装 了 PHP 7.0 对 于 MySQL 的 支持 依赖 。 


安装 过 程 中 ， 会 要 求 输入 MYSQLroot 账 号 的 密码 ， 密 码 默认 使 用 “root”， 操 作 如 图 2-46 所 示 。 


[ 


ubuntu@ubuntu-xenial: ~ 


Package configuration 


Configuring mysql-server-5.7 
While not mandatory, it is highly recommended that you set a password for the MySQL administrative "root" user. 


If this field is left blank, the password will not be changed . 
New password for the MySQL “root”user: 


<Ok> 


图 2-46 ”设置 MySQL 管 理 员 账号 密码 


(2) 使 用 MySQL 默 认 客 户 端 


安装 完毕 后 ， 可 以 使 用 以 下 命令 实现 MySQL 的 命令 行 管理 操作 ， 出 现 如 图 2-47 所 示 界 面 说 明 MySQL 已 经 安装 成 功 。 


ubuntu@ubuntu-xenial:~$ mysql -u root -p 

Enter password: 

Welcome to the MySQL monitor. Commands end with 
Your MySQL connection id is 6 

Server version: 5.7.19-0ubuntu6.16.64.1 (Ubuntu ) 


Copyright (c) 2800, 2017, Oracle and/or its affiliates。All rights reserved . 


Oracle is a registered trademark of Oracle Corporation and/or its 
affiliates. Other names may be trademarks of their respective 
owners. 


Type ‘help;' or ‘\h' for help. Type ‘'\c' to clear the current input statement. 


mysql> 


图 2-47 ”在 命令 行 中 管理 MySQL 数 据 库 


(3) 安装 phpMyAdmin 


当 数 据 操作 频繁 的 时 候 ， 使 用 命令 行 并 不 是 最 好 的 办 法 ， 这 里 推荐 安装 基于 PHP 编 写 的 Web 数 据 库 管 理工 phpMyAdmin， 使 用 apt 可 以 直接 下 载 安装 ， 执 行 命令 如 下 : 


sudo apt-get install -yY phpmyadmin 


在 安装 过 程 中 ， 一 直选 择 默 认 选 项 即 可 。 其 中 提示 输入 MySQL 密 码 的 时 候 ， 需 要 输入 你 自行 设置 的 数据 库 密码 ， 这 里 设置 为 root， 如 图 2-48 所 示 。 


ubuntu@ubuntu-xenial; ~ 


Package configuration 


Configuring phpmyadmin 
Please provide a password for phpmyadmin to register with the database server. If left blank，a random password 
will be generated . 


MySQL application password for phpmyadmin: 


TO | 


<Ok> <Cancel> 


图 2-48 ”安装 的 phpMyAdmin 过 程 中 的 数据 库 密码 设置 


等 待 安装 完成 后 ， 执 行 以 下 命令 为 phpMyAdmin 创 建 软 链接 ， 为 后 面 的 虚拟 主机 配置 打下 程序 基础 : 


sudo ln -s /usr/share/phpmyadmin mysql 


有 提示 : phpMyAdmin 因 为 安全 性 原因 ， 某 些 版 本 默认 不 支持 MySQL 空 密码 连接 ， 所 以 建议 读者 不 要 给 数据 库 设 置 空 密码 。 另 外 ， 设 置 的 密码 也 不 要 过 于 简单 ， 以 提高 服务 器 的 安全 性 。 


2.3.5 ”配置 虚拟 站 点 
本 节 以 可 以 正常 访问 phpMyAdmin 为 例 ， 配 置 对 应 的 虚拟 机 主机 ， 以 便 方 便 管理 MySQL， 操 作 步 又 如 下 。 


(1) 新 增 Nginx 虚 拟 主机 配置 文件 


首先 在 /etc/nginx/ 目 录 下 新 增 vhost 目 录 ， 此 目录 专门 用 来 存储 虚拟 主机 的 配置 文件 。 


随后 编辑 Nginx 默 认 的 配置 文件 /etc/nginx/sites-enabled/default， 追 加 以 下 配置 代码 ， 实 现 自动 引入 vhosts 下 的 子 配置 文件 : 


include /etc/nginx/vhosts/*; 


随后 进入 /etc/nginx/vhosts 目 录 下 ， 新 增 www.mysql.conf 文 件 ， 增 加 并 保存 内 容 如 下 : 


server { 
listen 8080; # 监听 8080 端 口 
root /var/www/html/mysql; # 虚拟 主机 根 目录 定位 到 phpMyAdmin 的 链接 
index index.html index.htm index.nginx-debian.html index.php; 
server name www.mysql .com; # 虚拟 域名 
location / { # URIL 隐 藏 jndex.php 文 件 
if ( !-e $request filename) { 
rewrite ^(.*)$ /index.php/$1 last; 
break; 
} 
i 
location ~ \.php { # PHP 解析 规则 
fastcgi split path info ^(.+\.php) (/.+)$; 
fastcgi pass unix:/var/run/php/php7.0-fpm.sock; 
fastcgi index index.php; 
include fastcgi params; 
fastcgi param SCRIPT FILENAMF $document root$fastcgi script_ 
name; 
fastcgi param PATH INFO $request uri; 


上 述 的 配置 文件 较为 复杂 ， 但 是 此 时 只 需要 知道 虚拟 站 点 的 端口 是 8080， 站 点 的 根 目录 定位 到 phpMyAdmin 源 代码 目录 即 可 。 


(2) 重启 Nginx 和 PHP-FPM 后 查看 站 点 效果 


完成 编辑 后 ， 保 存 配置 文件 ， 重 载 Nginx 配 置 ， 重 启 PHP-FPM ， 在 浏览 器 中 访问 http://192.168.33.20:8080， 即 可 使 用 虚拟 站 点 phpMyAdmin， 如 图 2-49 所 示 。 


phpMyAdm in 团 服 务 器 : phpMyAdmin demo -= MySQL > 图 数据 库 : arp 
分 加 日 占 闪 6 于 结构 加 SQL 对 搜索 回 查询 图 导出 图 导 入 咏 操 


Current server: 


phpMyAdmin demo -Mys 


近期 访问 ” 表 收 藏 夹 


操作 
离 园 浏 览 洲 结 构 三 搜索 也: 插入 过 清空 @ 删除 
诊 浏览 y 结构 名 搜索 杀 插入 品 清空 @ 删除 


FL accounts bb 高 辐 浏 览 月 结构 过 搜索 3 插入 及 清空 @ 删除 
~ 请 司 浏 览 3 结构 旬 搜索 对: 插入 肪 清空 @ 删除 
J banip business 请 辐 浏 览 结构 号 搜索 3 插入 篇 清空 @ 删除 
(Fh business ) casino 高 四 浏览 纹 结构 旬 搜 索 对: 插入 册 清空 @ 删除 
2 config ; 浏览 电 


图 2-49 ”在 虚拟 机 中 访问 phpMyAdmin 


2.3.6 ”其 他 常用 设置 


1. 修 改 日 期 默认 时 区 


除了 常见 工具 的 安装 ， 还 需要 设置 一 下 系统 的 时 区 。 首 先 执行 以 下 命令 : 


sudo dpkg-reconfigure tzdata 


出 现 图 形 界面 后 ， 先 选择 Asia， 再 选择 Shanghai， 即 可 设置 当前 时 间 的 时 区 为 东 八 区 ， 如 图 2-50 所 示 。 


ubuntu@ubuntu-xenial; /etc/nginx/vhosts 一 口 xX 


Package configuration 


Configuring tzdata 
Please select the geographic area in which you live. Subsequent configuration questions will narrow this down by 
presenting a list of cities, representing the time zones in which they are located. 


Geographic area: 


Africa 

America 
Antarctica 
Australia 

Arctic Ocean 

Asia 

Atlantic Ocean 
Europe 

Indian Ocean 
Pacific Ocean 
System V timezones 
US 

None of the above 


<Cancel> 


ubuntu@ubuntu-xenial: /etc/nginx/vhosts 一 口 xX 
9 


Package configuration 


Configuring tzdata 
Please select the geographic area in which you live. Subsequent configuration questions will narrow this down by 
presenting a list of cities, representing the time zones in which they are located. 


Geographic area: 


Africa 
America 
Antarctica 
Australia 
Arctic Ocean 
Asia 


Atlantic Ocean 


Europe 

Indian Ocean 
Pacific Ocean 
System V timezones 
US 

None of the above 


<Cancel> 


图 2-50 设置 系统 时 间 的 时 区 


2. 远 程 连接 MySQL 数 据 库 


除了 使 用 phpMyAdmin 管 理 数据 库 外 ， 还 可 以 使 用 宿主 机 的 数据 库 管 理工 具 进 行 远程 管理 。 这 里 以 Navicat 数 据 库 管理 工具 为 例 ， 讲 解 如 何 远 程 连接 MySQl 数 据 库 。 


编辑 MySQL 的 配置 文件 ， 执 行 以 下 命令 : 


Vim /etc/mysql/mysql.conf.d/mysqld.cnf 


其 中 : 


bind-address =127.0.0.1 


修改 为 : 


bind-address = 0.0.0.0 


保存 后 ， 执 行 以 下 命令 重启 MySQL: 


sudo /etc/init.d/mysql restart 


随后 进入 MySQL 命 令 行 管理 界面 ， 输 入 以 下 命令 ,给 账号 分 配 远程 操作 的 权限 : 


GRANT ALL PRIVILEGES ON *.* TO 'root'@'%' IDENTIFIED BY '123456' WITH GRANT OPTION; 


其 中 “123456” 为 账号 密码 ， 需 要 修改 成 自己 的 密码 。 执 行 以 下 命令 ， 让 设置 生效 : 


FLUSH PRIVILEGES; 


最 后 开启 防火 墙 对 3306 端 口 的 支持 : 


sudo iptables -I INPUT 4 -p tcp -m state --state NEW -m tcp ~-dport 3306-]j ACCEPT 


在 宿主 机 上 ， 使 用 Navicat 客 户 端 就 可 以 远程 管理 Vagrant 虚 拟 机 中 的 MySQL 了 。 成 功 连接 并 操作 数据 库 ， 如 图 2-51 所 示 。 


器 192.168.33.19 - 连接 尾 性 


连接 名 : 


主机 名 或 IP 地 址 : 
端口 : 

用 户 各 : 

密码 : 


常规 高 级 SSL SSH HTTP 


192.168.33.20 


192.168.33.20| 


LY 192.168.33.20 


3306 


root 


加 保存 密码 


information schema 
mysql 


performance_schema 


phpmyadmin 
sys 


图 2-51 远程 连接 并 管理 MySQL 数 据 库 


第 3 章 ”更 先进 的 版 本 管理 工具 一 一 Git 


现在 越 来 越 多 的 企业 和 团队 选择 使 用 Git 作 为 代码 的 版 本 管理 工具 。Git 因 为 本 身分 布 式 的 架构 设计 和 更 为 高 效 的 分 支 模型 ,解决 了 很 多 传统 版 本 管理 工具 使 用 中 的 缺陷 。 


3.1 SVN 与 Git 


说 起 Git， 就 不 得 不 提 老 牌 的 版 本 管理 工 


一 一 SVN。 本 节 主 要 讲解 SVN 与 Git 的 差异 ， 帮 助 只 使 


3.1.1 ”Git 与 GitHub 


过 类 似 SVN 版 本 管理 工具 的 开发 者 初步 掌握 Git 的 使 用 原理 。 


提 到 Git 版 本 控制 系统 ， 就 不 得 不 说 其 作者 Linus 一 一 Linux 操 作 系统 的 发 明 者 。 在 Git 出 现 之 前 ，Linus 不 愿意 使 用 SVN 或 者 CVS 这 些 版 本 控制 系统 ， 认 为 其 必须 联网 的 设 定 十 分 不 便 。 但 同时 Linux 代 码 


库 本 身 的 代码 更 新 、 补 丁 和 迭代 等 都 在 使 用 手工 管理 ， 这 在 很 大 程度 上 影响 了 开发 效率 ， 所 以 Linus 选 择 了 商业 的 版 本 控制 系统 BitKeeper 作 为 Linux 的 版 本 管理 系统 。 因 为 Linux 系 统 的 巨大 影响 力 ，BitKeeper 


的 母 公司 BitMover 也 授权 Linux 社 区 免费 使 


Linux 的 吉祥 物 ， 如 图 3-1 所 示 。 


这 个 系统 。 


而 发 明 Git， 也 是 因为 这 个 商业 版 本 控制 系统 。 当 时 有 开源 社区 的 开发 者 试图 破解 BitKeeper 的 协议 ， 随 后 被 BitMover 公 司 发 现 ， 于 是 要 收回 


图 3-1 Linux 的 吉祥 物 ( 一 只 企 殷 ) 


控制 系统 ， 只 花 了 两 周 的 


如 今 很 多 知名 的 项 目 和 


而 GitHub 是 一 个 通过 Git 进 行 版 本 控制 的 软件 源 代 码 托 管 服务 3 


时 间 就 完成 了 第 一 个 版 本 ， 这 就 是 Git。 后 来 Git 便 迅速 流行 起 来 。 


企业 都 在 使 用 Git， 如 图 3-2 所 示 。 


F 台 ， 其 实质 是 一 个 网 站 。 很 多 开发 者 会 把 Git 和 GitHub 混 淆 ， 如 果 明 白 其 各 


Linux 社 区 的 免费 授权 。 之 后 Linus 决 定 使 用 自行 开发 的 版 本 
的 作用 就 很 容易 区 分 了 。GitHub 自 从 2008 年 上 线 后 ， 吸 引 


了 大 量 的 开源 项 目 入 驻 ， 


中 就 有 我 们 熟悉 的 PHP、jQuery 等 知名 项 目 ， 也 有 很 多 优秀 的 开发 者 在 上 本 


托管 了 优秀 的 开源 项 目 ， 方 便 了 开发 者 之 


间 的 学 习 与 交流 。 


facebook 


Coogle 


LE 
! 哪 ' 
an23aolD ~ 


GitHub 上 的 AWESOME 项 目 统计 了 很 多 开源 项 目 ， 方 便 开 发 者 检索 使 用 。 


Django 

Flask 

Docker 

Vagrant 

Pyramid 

Play1 Framework 

CakePHP - PHP framework. 


Symfony 
©o Education 


Laravel - PHP framework. 
oO Education 


Rails 
o Gems - Packages. 


Phalcon 
Useful .htaccess Snippets 


nginx 


Dropwizard 


Kubernetes 
Lumen 


Serverless Framework 


3.1.2 ”Git 与 SVN 的 异同 


Microsoft twitter Linked 国 


3-2 ”使 用 Git 的 知名 项 目 与 企业 


Frontend Development 
iOS 

Android 

loT & Hybrid Apps 
Electron 

Cordova 

React Native 

Xamarin 


Linux 
o Containers 


macOSs 
o Command-Line 


© Screensavers 
WatchOs 
JVM 
Salesforce 
Amazon Web Services 
Windows 
IPFS 
Fuse 


Heroku 


图 3-3 很 多 项 目 (包括 PHP) 都 已 经 迁移 到 了 GitHub 上 


图 3-3 展 示 了 在 GitHub 上 的 部 分 项 目 ， 当 然 在 GitHub 上 托管 的 项 目 还 远 不 止 这 些 ， 大 家 可 以 看 看 有 没有 自己 熟悉 的 技术 和 项 


Common Lisp 
Perl 

Groovy 

Dart 


Java 
Oo RxJava 


Kotlin 
OCaml 
ColdFusion 
Fortran 


.NET 
oo Core 


PHP 
o Composer - Package manager. 


Delphi 
Assembler 
AutoHotkey 
Autolt 
Crystal 
TypeScript 


在 Git 被 广泛 使 用 之 前 ，SVN 取 代 了 更 为 老 旧 的 CVS 版 本 控制 系统 ， 是 最 流行 的 版 本 控制 系统 之 一 。 而 SVN 最 大 的 特性 就 是 必须 联网 才 可 以 使 用 ， 版 本 库 在 唯一 的 一 台 SVN 服 务 器 上 。 在 这 种 情况 下 ， 网 
因为 版 本 库 记录 和 原始 代码 都 在 一 台 服务 器 上 ， 若 服务 器 出 现 异常 ， 可 能 会 导致 版 本 库 损 坏 、 丢 失 代码 或 丢失 提交 记录 等 问题 。 


络 不 稳定 等 潜在 不 稳定 因素 ， 都 将 会 影响 开发 者 的 代码 使 用 体验 。 此 外 ， 


典型 的 SVN 版 本 库 使 用 结构 如 图 3-4 所 示 。 


相 比 SVN，Git 最 大 的 特点 就 是 分 布 式 ， 每 个 用 户 在 本 地 都 拥有 一 个 完整 的 版 本 库 和 提交 记录 ， 而 且 不 需要 联网 就 可 以 提交 代码 。Git 的 典型 使 用 结构 ， 如 图 3-5 所 示 。 


Git 服 务 器 


计算 机 主机 计算 机 主机 


图 3-5 分布 式 版 本 控制 系统 结构 示意 图 


相 比 SVN 这 样 的 集中 式 版 本 控制 系统 ，Git 的 优势 主要 有 以 下 几 点 。 


“ 分 布 式 部 署 ， 每 一 个 用 户 都 可 以 成 为 版 本 库 ， 降 低 了 单 点 系统 故障 出 现 的 风险 。 


“无须 联网 ， 本 地 就 可 以 提交 代码 。 


“ 具有 更 好 用 的 分 支 体系 ， 当 然 主 要 原因 也 在 于 版 本 库 在 本 地 。 


“ 可 以 本 地 查看 提交 的 日 志 记 录 。 


“ 性 能 高 ， 适 合 各 种 规模 的 项 目 。 


虽说 Git 看 似 完美 ， 但 在 实际 使 用 中 ， 也 存在 以 下 不 足 : 


“ 概念 较为 复杂 ， 学 习 曲 线 陡峭 ， 不 如 SVN 方 便 入 门 。 
"权限 系统 不 如 SVN 严 格 。 


人 提示: 版 本 控制 系统 的 选择 ， 还 需要 根据 具体 的 应 用 场景 具体 分 析 ， 没 有 最 好 用 的 版 本 控制 系统 ， 只 有 最 适合 的 版 本 控制 系统 。 


3.1.3 ”在 Windows 上 安装 Git 


Git 支 持 跨 平台 安装 ， 一 般 通 过 两 种 方式 安装 : 安装 包 安装 或 者 编译 安装 。Linux 系 统 和 Mac OS 系统 上 一 般 都 预 装 了 Git， 所 以 在 这 里 以 Windows 系 统 为 例 ， 学 习 如 何 快速 安装 Git。 以 下 载 安装 包 方式 


安装 Git 的 具体 步骤 如 下 : 


(1) 下 载 安装 包 
在 浏览 器 中 访问 地 址 https://git-scm.com/downloads， 进 入 Git 安 装 包 的 下 载 页面 。 这 里 需要 选择 Windows 版 本 后 ， 单 击 Downloads for Windows 按 钮 即 进入 安装 包 下 载 页面 ， 随 后 选择 64 位 版 本 开 


始 下 载 ， 如 图 3-6 所 示 。 


Downloads - 


一 
Latest source Release 


2.14.1 


氢 MacOSX 人 胡 Windows 
(2017-08-04) 


A Linux » Solaris Downloads for Windows 


Older releases are available and the Git source 


repository is on GitHub. 


图 3-6 ”选择 合适 的 Git 版 本 并 下 载 安装 包 


(2) Git 安 装 
安装 包 下 载 完成 后 ， 双 击 该 安装 包 即 可 以 开始 安装 。 安 装 过 程 与 一 般 软 件 工具 没有 太 大 区 别 ， 只 不 过 在 安装 过 程 中 会 遇 到 很 多 的 单 选 按钮 、 复 选 框 ， 这 些 都 使 用 默认 值 即 可 。 Git 在 安装 结束 后 ,在 
Windows 系 统 下 的 任意 文件 夹 上 右 击 ， 若 在 右键 菜单 中 可 以 找到 Git Bash Here 命 令 , 说明 安 装 成 功 ， 如 图 3-7 所 示 。 


» Git 2.14.1 Setup 一 X 
查看 (V) > 
Installing 全 

Please wait while Setup installs Git on your computer. 今 排序 方式 (O) > 
刷新 (6) 

C:\Program Files\Git\mingwé4\ib\td8.6\tzdata\America\Indiana\Indianapolis 类 贴 [p) 

Bn 粘贴 快捷 方式 (9) 
撤消 复制 (U) Ctrl+Z 


fy Git GUI Here 


#> Git Bash Here 


新 建 (W) > 


显示 设置 (D) 
| 个 性 化 (R) 


图 3-7 在 Windows 系 统 下 安装 Git 工 具 


(3) 查看 Git 的 版 本 


选择 右键 菜单 中 的 Git Bash Here 命 令 ， 在 出 现 的 命令 行 中 输入 以 下 命令 ， 查 看 Git 的 当前 版 本 : 


git -version 


结果 如 图 3-8 所 示 ， 则 说 明 Git 已 经 可 以 正常 使 用 。 


AdministratorQICOS-20170821BU 
$ git --version 


git version 2.14.1.windows.1 


图 3-8 ”使 用 命令 行 查看 Git 的 当前 版 本 


3.2 ”Git 常 用 命令 操作 


Git 本 身 提供 了 大 量 的 命令 接口 ， 以 实现 各 种 操作 。 因 为 Git 命 令 比 较 多 ， 初 学 者 难以 快速 记忆 ， 所 以 有 很 多 图 形 化 的 工具 可 以 帮助 初学 者 降低 使 用 门槛 ， 如 Windows 系 统 下 的 TortoiseGit 和 Mac OS 下 
的 SmartGit。 这 些 工具 都 非常 优秀 ， 让 开发 者 可 以 完全 进行 可 视 化 的 操作 ， 但 是 应 用 服务 器 一 般 都 不 带 图 形 化 界面 ， 所 以 掌握 Git 命 令 还 是 非常 必要 的 。 


初学 者 在 不 借助 可 视 化 交互 工具 的 情况 下 学 习 Git 的 操作 时 ， 常 常会 陷入 超 多 命令 的 “汪洋 大 海 ” 中 ， 其 过 程 会 非常 痛苦 。 本 节 精 选 Git 中 使 用 率 最 高 的 命令 逐一 讲解 ， 从 基础 的 版 本 库 的 创建 ， 到 添加 
文件 ， 再 到 最 终 的 提交 操作 ， 达 到 增强 初学 者 的 记忆 和 熟练 度 的 效果 。 


3.2.1 ”创建 版 本 库 


版 本 库 又 名 “仓库 ”， 是 Git 用 来 存储 、 跟 踪 和 记录 文件 修改 的 目录 。 因 为 Git 分 布 式 的 特性 ， 每 个 主机 上 都 可 以 创建 和 管理 版 本 库 。 


这 里 以 Windows 10 系 统 (在 VirtualBox 中 安装 的 虚拟 系统 ) 下 的 phpStudy 软 件 作为 PHP 的 集成 开发 环境 ， 集 成 开发 环境 默认 安装 在 C 盘 目录 下 。 


(1) 打开 PHP 集 成 开发 环境 的 服务 器 根 目录 WWW， 新 增 并 进入 shop 目 录 。 


(2) 右 击 打 开 Windows 系 统 菜 单 ， 选 择 Git Bash Here 命 令 打开 终端 工具 。 输 入 以 下 命令 初始 化 本 地 版 本 库 。 


git init 


(3) 创建 完毕 ， 出 现 如 下 结果 : 


$ git init 
Initialized empty Git repository in C:/phpStudy/WHW/shop/ .git/ 


(4) 从 返回 结果 可 以 看 到 ， 在 shop 目 录 下 生成 了 一 个 .git 目 录 。 此 目录 就 是 Git 用 来 管理 和 跟踪 文件 变更 的 ， 跟 SVN 版 本 控制 工具 生成 的 .svn 目 录 类 似 ， 但 是 原理 不 一 样 。 另 外 ， 没 有 特殊 需求 不 建议 手 
动 操作 ， 以 防止 版 本 信息 丢失 。 


有 提示 : .git 目录 默认 是 隐藏 的 ， 可 以 在 Git Bash 终 端 中 使 用 ls-al 命 令 查看 。 


3.2.2 ”提交 文件 到 版 本 库 


3.2.1 节 的 操作 成 功 创建 了 一 个 空 版 本 库 ， 下 面 讲解 如 何 提交 文件 到 版 本 库 。 因 为 Windows 系 统 下 的 记事 本 功能 比较 单一 ， 可 能 会 出 现 一 些 文本 编码 格式 的 问题 ， 所 以 本 实例 使 用 Atom 作 为 默认 的 文本 
编辑 器 ， 文 本 编码 格式 默认 为 UTF-8。 


在 shop 目 录 下 新 增 index.php 脚 本 文件 ， 并 增加 以 下 内 容 : 
<?php 
echo ' 现 在 的 时 间 ; ' .date ('Y-m-d H:i:s'); 


若 想 提交 index.php 这 个 文件 到 版 本 库 中 ， 需 要 执行 以 下 两 个 步骤 。 


(1) 使 用 git add 命 令 ， 添 加 文件 到 版 本 库 中 。 


git add index.php 


执行 后 如 果 没 有 返回 值 (UNIX 系 统 的 习惯 ， 无 提示 说 明 则 表示 无 异常 》， 说 明 执行 成 功 。 
全 提示 : 如 果 是 使 用 Git Bash 自 带 的 Vim 编 辑 器 编辑 的 index.php 文 件 ， 执 行 后 会 发 现 有 如 下 警告 信息 : 


$ git add index.php 
warning: LF will be replaced by CRLF in index.php. 
The file will have its original line endings in your working directory. 


之 所 出 会 出 现 上 述 警 告 信息 ， 是 因为 Git Bash 本 质 上 是 在 Windows 下 模拟 Linux 系 统 环境 ,默认 使 用 LF 换行 符 格 式 ， 而 Windows 系 统 使 用 CRLF 换 行 符 格 式 ， 不 过 Git 本 身 预 先 考 虑 了 这 样 的 问题 ， 内 置 了 自 
动 换行 符 的 转换 。 


不 过 团队 开发 中 ， 代 码 的 换行 符 一 般 需要 统一 ， 若 不 想 在 提交 时 自动 转换 ， 可 以 执行 以 下 命令 语句 : 


git config --global core.autocrlf false 


Git 自 动 转换 换行 符 原理 如 


网 


3-9 所 示 。 


(2) 使 用 git commit 命 令 ， 把 添加 的 文件 提交 到 版 本 库 中 。 


git commit -m "首页 入 口 文件 " 


Linux、macOS 系 统 下 的 工作 区 
配置 : autocrl 人 -true 


git commit 


master 分 支 


3-9 ”Git 在 提交 代码 时 可 以 自动 转换 换行 符 


命令 执行 后 ， 出 现 如 下 结果 : 


$ git commit -m ' 首 页 入 口 文件 ' 
*** Please tell me who you are. 
Run 
git config ~-global user.email "you@example.com" 
git config --global user.name "Your Name" 
to set your account's default identity. 
Omit --global to set the identity only in this repository. 
fatal: unable to auto-detect email address (got 
'Administrator@ICOS-20170903PV. (none) ') 


之 所 以 会 提交 失败 ， 是 因为 在 Git 安 装 完成 后 ， 没 有 配置 系统 的 用 户 名 和 上 邮箱。Git 本 身 是 分 布 式 的 ， 所 以 需要 这 些 信息 作 为 唯一 的 身份 标识 。 执 行 以 下 命令 配置 用 户 信息 : 


git config --global user.name "wangjialin" 
git config --global user.email "wangjialin.bj@gmail .com" 


命令 中 --global 参 数 说 明 是 全 局 配置 。 执 行 完 成 后 ， 再 次 进行 提交 ， 完 成 后 提示 结果 如 下 : 


$ git commit -m ' 首 页 入 口 文件 ' 
[master (root-commit) 5635211] 首页 入 口 文件 
1 file changed, 2 insertions (+) 
create mode 100644 index.php 


执行 命令 时 ，git commit 操 作 后 面 的 -m 参 数 用 来 指定 当 次 提交 的 注释 说 明 。 这 里 建议 大 家 根据 提交 内 容 认 真 书写 ， 以 方便 后 面 的 版 本 管理 。 


3.2.3 ”Git 查 看 版 本 库 信 息 


文件 的 内 容 。 修 改 代码 如 下 : 


这 时 继续 修改 index.php 文 件 ， 丰 富 入 


<?php 
header ('Content-type:text/html;charset=utf8') 7 
echo ' 当 前 的 时 间 :" .date('Y-m-d H:i:s'); 


脚本 新 增 了 一 行 代码 ， 模 拟 常见 的 文件 修改 操作 。 


(1) 及 时 掌握 版 本 库 的 各 种 信息 


为 了 可 以 及 时 掌握 版 本 库 的 各 种 信息 ， 可 以 使 用 以 下 命令 查看 工作 区 中 文件 的 变化 情况 : 


git status 


执行 结果 如 下 : 


$ git status 
On branch master 
Changes not staged for commit: 
(use "git add <file>http://www.hzcourse.com/resource/readBook?path=/openresources/teach ebook/uncompressed/17746/0EBPS/Text/..." to update what will be committed) 
(use "git checkout -- <file>http://www.hzcourse.com/resource/readBook?path=/openresources/teach ebook/uncompressed/17746/O0EBPS/Text/..." to discard changes in working director 
modified: index.php 
no changes added to commit (use "git add" and/or "git commit -a") 


在 执行 结果 中 ， 可 以 看 出 哪个 文件 被 修改 了 。 


(2) 查看 本 次 修改 的 内 容 


若 需要 查看 本 次 修改 的 内 容 ， 需 要 执行 以 下 命令 : 


git diff 


执行 结果 如 下 : 


$ git diff 
diff --git a/index.php b/index.php 

index ccd457ehttp://www.hzcourse.com/resource/readBook?path=/openresources/teach ebook/uncompressed/17746/0OEBPS/Text/..a380dce 100644 
--- a/index.php 

+++ b/index.php 

Be =172 +173 @@ 

<?pPhp 

+header ('Content-type:text/html;charset=utf-8'); 

echo ' 当 前 的 时 间 :' .date('Y-m-d H:i:s'); 


通过 diff 命 令 ， 可 以 看 到 在 index.php 脚 本 里 新 增 了 一 行 代码 。 在 输出 结果 中 ，“+” 说 明 此 行文 本 有 修改 和 增加 操作 ， 而 “-” 说 明 有 删除 操作 。 


(3) 完成 代码 提交 


随后 再 次 执行 提交 流程 : 先 执行 git add 命 令 ， 再 使 用 git status 命 令 查 看 文件 修改 状态 ， 在 确认 无 误 后 ， 使 用 git commit 命 令 操作 ， 把 文件 修改 提交 到 Git 的 版 本 库 (本 地 ) 中 。 两 次 操作 的 执行 结果 如 


$ git commit -m ' 增 加 了 一 行 代码 ' 
[master al2f7b9] 增加 了 一 行 代码 

1 file changed, 1 insertion (+) 

$ git status 

On branch master 

nothing to commit, working tree clean 


人 提示 : 在 开发 环境 下 ， 使 用 可 视 化 的 工具 查看 文件 修改 细节 ， 效 率 会 更 高。 


3.2.4 日志 查看 与 版 本 回 退 


在 多 次 提交 后 ， 有 时 候 因为 错误 的 提交 或 者 其 他 原因 ， 需 要 把 文件 回 退 到 某 一 个 提交 版 本 ， 这 时 候 就 需要 先 查看 提交 的 历史 记录 ， 检 索 每 次 提交 的 唯一 标识 ， 然 后 再 决定 版 本 回 退 到 哪个 版 本 。 


(1) 日 志 查看 


执行 以 下 操作 ， 查 看 Git 最 新 的 提交 日 志 。 


git log 


可 以 看 到 有 两 次 提交 记录 ， 根 据 时 间 排 列 从 近 到 远 显示 ， 结 果 如 下 : 


$ git log 

commit 85af61l3a2aacc3ef0769a7c8c9d1llfbe35cd9760 (HEAD -> master) 
Author: wangjialin <wangjialin.bj@gmail .com> 

Date: Tue Aug 22 16:05:57 2017 +0800 


增加 了 一 行 代码 
commit fce3709e8298007dcc733d461be4f913c539eal16 
Author: wangjialin <wangjialin.bj@gmail.com> 
Date: Tue Aug 22 15:33:45 2017 +0800 


首页 入 口 文件 


可 以 看 到 提交 Git 的 版 本 号 是 一 个 十 六 进 制 的 序列 字符 串 ， 因 为 Git 是 分 布 式 的 ， 所 以 不 能 像 SVN 一 样 使 用 纯 数 字 的 版 本 号 ， 否 则 在 多 人 开发 时 极 易 出 现 冲突 。 日 志 里 面包 含 了 版 本 号 、 提 交 账 号 信息 、 
提交 时 间 和 提交 的 备注 说 明 。 


全 捉 示 : 可 以 进行 精简 版 的 日 志 列 表 显 示 ， 只 需要 在 命令 后 面 加 上 “--pretty=oneline” 参数 即 可 。 添 加 后 ， 再 次 执行 ， 结 果 如 下 : 


$ git log --pretty=oneline 
85af613a2aacc3ef0769a7c8c9d11fbe35cd9760 (HEAD -> master) 增 加 了 一 行 代码 
fce3709e8298007dcc733d461lbe4f913c539ea16 首页 入 口 文件 


(2) 版 本 回 退 


查看 日 志 的 时 候 ， 若 已 经 发 现 可 以 回 退 的 版 本 号 ， 就 可 以 执行 回 退 操作 了 。 不 过 在 Git 中 版 本 回 退 有 本 地 和 远程 两 种 类 型 ， 两 者 的 操作 流程 稍 有 不 同 ， 但 目前 实例 的 版 本 库 在 本 地 ， 所 以 暂时 不 关注 如 何 
操作 远程 的 版 本 回 退 。 


回 退 的 命令 有 如 下 两 种 方式 。 

“ git reset--hard commit-id: 将 文件 回 退 到 指定 版 本 号 。 适 合 提交 记录 比较 多 ， 需 要 回 退 到 某 一 个 提交 版 本 的 情况 。 

“git reset--hard HEAD~3: 将 文件 最 近 3 次 的 提交 回 退 。 适 合 对 刚 提交 的 文件 进行 回 退 ， 开 发 者 可 以 自 定义 回 退 的 次 数 。 
下 面 以 第 一 种 为 例 ， 回 退 版 本 到 第 一 次 的 提交 版 本 。 


(1) 操作 如 下 命令 : 


git reset --hard fce3709 


(2) 执行 后 的 输出 结果 如 下 : 


$ git reset --hard fce3709 
HEAD is now at fce3709 首页 入 口 文件 


(3) 打开 index.php 脚 本 文件 后 ， 发 现代 码 已 经 回 退 到 最 早 提交 的 版 本 ， 第 二 次 提交 时 在 脚本 增加 的 header 方 法 ， 已 经 消失 不 见 了 。 


<?php 
echo ' 当 前 的 时 间 :' .date('Y-m-d H:i:s'); 


在 版 本 回 退 时 ， 不 需要 输入 完整 的 版 本 号 ， 只 需要 输入 前 几 位 即 可 ，Git 会 自动 检索 匹配 。 输 入 的 版 本 号 建议 在 6 位 以 上 ， 以 免 Git 检 索 出 多 条 记录 。 


3.2.5 ”了解 工 作 区 、 暂 存 区 和 版 本 库 


熟悉 了 以 上 几 个 基础 的 Git 操 作 命 令 后 ， 为 了 深入 理解 ， 下 面 继续 介绍 几 个 Git 里 面 的 常见 概念 。 


“ 工作 区 : 开发 者 可 以 看 到 和 操作 的 文件 目录 ， 例 如 上 面 实例 中 的 shop 目 录 。 
“ 暂 存 区 : 因为 Git 的 版 本 库 在 本 地 ， 开 发 者 执行 git add 操 作 后 ， 文 件 修改 等 会 被 提交 到 暂 存 区 。 


“版 本 库 : 工作 区 目录 下 的 .git 目 录 下 存储 了 Git 的 版 本 库 信息 ， 除 了 提交 信息 、 分 支 信息 外 ， 暂 存 区 也 被 存放 在 里 面 。 


举例 来 说， 在 shop 工 作 区 中 ， 原 来 只 有 index.php 一 个 文本 ， 开 发 者 后 来 新 增 了 phpinfo.php 文 件 ， 执 行 了 git add 命 令 后 ， 工 作 区 的 内 容 会 被 提交 到 和 暂 存 区 ， 而 执行 git commit 命 令 后 ， 暂 存 区 的 内 容 
就 会 被 提交 到 版 本 库 中 的 master 分 支 ， 如 图 3-10 所 示 。 


开发 目录 版 本 库 开发 目录 版 本 库 


Imaster 分 支 


工作 区 


工作 区 暂 存 区 
index.php index.php index.php 


DRTo Db index.php 


phpinfo.php 


phpinfo.php phpinfo.php 


git add 操 作 git commit 操 作 
图 3-10 ”Git 中 的 工作 区 、 暂 存 区 和 版 本 库 


提示: 暂 存 区 是 Git 里 面 非常 重要 的 概念 ， 党 握 了 暂 存 区 的 概念 ， 可 以 加 深 了 解 Git 操 作 的 原理 。 


3.3 “GitHub 远程 仓 库 


通过 3.2 节 的 学 习 ， 已 经 可 以 在 本 地 创建 一 个 完整 的 Git 版 本 库 了 。 不 过 在 实际 开发 中 ， 无 论 是 使 用 GitHub， 还 是 在 本 地 搭建 Git 版 本 库 ， 都 少不了 操作 远程 仓库 。 本 节 重 点 讲解 在 GitHub 上 创建 远程 仓 
库 及 其 相关 操作 。 


3.3.1 “在线 注册 远程 仓库 


在 Git 看 来 ， 每 一 台 计 算 机 都 可 以 成 为 一 个 代码 仓库 ， 虽然 这 样 说 ， 但 是 也 可 以 专门 搭建 一 台 服 务 器 提供 仓库 功能 。 但 现 阶段 搭建 服务 器 比较 烦琐 ， 也 有 各 种 限制 ， 所 以 若 没 有 特殊 需求 ， 可 以 在 
GitHub 上 搭建 远程 仓库 。 


GitHub 本 身 提供 有 条 件 的 免费 Git 仓 库 托管 服务 ， 注 册 使 用 远程 仓库 的 流程 如 下 。 


(1) 注册 账号 


只 需要 有 一 个 邮箱 ， 就 可 以 快速 注册 。 访 问 https://github.com/ 地 址 即 可 快速 注册 账号 ， 注 册 流 程 这 里 不 再 歼 述 。 


(2) 创建 SSH Key 


因为 本 地 的 Git 仓 库 和 远程 仓库 是 通过 SSH 加 密 传输 的 ， 所 以 需要 先 在 本 地 创建 SSH Key 密 钥 。 先 进入 虚拟 机 系统 的 用 户 目录 ， 用 户 目录 一 般 是 在 C 盘 下 的 Users 目 录 ， 根 据 用 户 的 登录 账号 选择 (本 实例 
虚拟 机 目录 是 C: \Users\Administrator) 。 在 目录 中 打开 Git Bash， 执 行 以 下 命令 : 


ssh-keygen -t rsa -C "GitHub 注册 邮箱 " 


命令 执行 过 程 中 有 一 些 输入 项 ， 是 一 些 密码 设置 ， 使 用 默认 值 一 路 按 回 车 键 即 可 ， 看 到 如 图 3-11 所 示 的 提示 ， 说 明 密 钥 生成 完毕 。 


he key s randomart lmage 1S: 
---[RSA 2648]----+ 


四 


密 钥 生 成 成 功 后 ， 在 用 户 目录 下 出 现 了 .ssh 文 件 夹 ， 里 面包 含 id_rsa 和 id_rsa.pub 两 个 密 钥 文件 ， 


文件 如 图 3-12 所 示 。 


(3) 在 GitHub 上 设置 SSH 密 钥 


在 成 功 生成 了 密 钥 文 件 后 ， 还 需要 在 GitHub 上 登记 这 个 密 钥 文件 (一般 指 公 钥 文 件 ) 内 容 ， 以 方便 后 理 


命令 进入 设置 页 面 ， 如 图 3-13 所 示 。 


图 3-11 成功 创建 SSH 密 铀 


中 id_rsa 文 件 是 私 铀 ， 需 要 妥善 保管 ， 不 要 泄露 。 而 id_rsa.pub 文 件 是 公 铀 ， 可 以 对 外 使 用 。 生 成 的 


的 加 密 数 据 传输 。 首 先 在 GitHub 上 登录 账号 ， 辣 


Fd 


6 右上 角 


的 头像 会 


现下 拉 


=: 


洲 寺 


和 ， 选 择 Settings 


Id rsa 


id_rsa.pub 


图 3-12 SSH 的 公 钥 和 私 铀 


3 站 ned in as 


wangjialinbeijing 


YOUTr protile 
YOUT stars 


YOUT WISts 


图 3-13 在 GitHub 的 用 户 菜单 中 选择 Setting 命 令 


在 设置 页 面 ， 选 择 SSH and GPG keys， 进 入 密 钥 的 设置 界面 ， 如 图 3-14 所 示 。 单 击 New SSH Key 按 钮 
id_rsa.pub 文 件 内 的 密 钥 字符 串 ， 使 用 ATOM 编 辑 器 即 可 打开 查看 。 


各， 出 现 密 钥 输 入 的 表单 输入 项 ， 其 中 Title 可 以 自行 定义 ，Key 的 内 容 就 是 刚才 生成 的 


Personal settings SSH keys 


Profile 
This is a list of SSH keys associated with your account. Remove any keys that you do not recognize. 


Account 
3 wangjialin_ssh_key 
Emails 
Fingerprint: c4:2c:c6:57:67:c7:4a:fc:91:f0:9b:22:ed:df:63:08 
Notifications ssH Added on 15 Mar 2017 
Last used within the last 6 months 一 Read/write 
Billing 


| SSH and GPG keys 
Title 


Security vagrant_ssh_key 


Blocked users 
Key 


Repositories 
RP ssh-rsa 


AAAAB3NzaC1yc2EAAAADAQABAAABAQDOmZOTyGJy8pXERePdqydbHvU7me6ltepVmmG3EPMyULbtDfFf2p5E 
yC5NjcT5AUxFLsPQVsskXEqcN4nxV79ZRfN8MHrNOTTF1i7SMEN4Wa0eSs5uFManghlOf6kEp4xNxzWf 和 1Y8pFHO 
gr+tomS5unDKNGbvXU/MkG+LC1dQa7aw5abYycAle8fqp6N/GqhB6L9c0YoMBTVhyJciaxbbjn4fpFAKGxVVA5Rw 
qOfWwF/3fVdZK4mqb1BKsYIMizk7DRIrGDV5Kd6R7gJantdjKYmP636hY3r06yrMMINRIfldgn89+xhZu0zJsZvE5ev 
Authorized OAuth Apps gJclYG+nGFQZsbWIwPRNGD wangjialin.bj@gmail.com 


Organizations 


Saved replies 


Authorized GitHub Apps 


Installed GitHub Apps 


Add SSH key 
Developer settings 


3-14 在 GitHub 上 设置 SSH 传 输 公 钥 内 容 


人 提示 : 在 进行 Key 表 单项 复制 、 粘 贴 操作 时 ， 字 符 串 后 不 要 有 空格 或 者 回 车 换行 ， 否 则 可 能 会 引起 添加 异常 。 


单 击 Add SSH key 按 钮 后 ， 即 可 完成 公 钥 的 添加 ， 成 功 添加 SSH 公 钥 如 图 3-15 所 示 。 


vagrant_ssh_key 
pd Fingerprint: b2:aa:b4:1d:97:9b:e4:89:ce:e3:b5:ec:b2:31:e2:c6 
ssH | Added on 30 Aug 2017 


Never used — Read/write 


Delete 


3-15 在 GitHub 上 成 功 添加 SSH 公 铀 


(4) 创建 远程 仓库 


添加 完成 SSH 密 钥 后 ， 回 到 GitHub 首 页 ， 在 网 页 的 右 侧 可 以 看 到 New repository 按 钮 ， 单 击 该 按钮 进入 创建 代码 仓库 界面 ， 如 图 3-16 所 示 。 


Create a new repository 


A repository contains all the files tor your project including the revision history. 


Owner Repository name 


园 wangjialinbeijing ~ phpshop 


Great repository names are short and memorable. Need inspiration? How about verbose-spork. 


Description {optional) 


Public 


Anyone can see this repository. You choose who can commit. 
C Private 
You choose who can see and commit ta this repository. 
口 Initialize this repository with a README 
This will let you immediately clone the repository to your computer. Skip this step if youre Importing an Existing repository. 


Add .gitignore: None ~ Add alicense: Nonev QO 


Create repository 


图 3-16 ”在 GitHub 中 创建 公共 的 仓库 


其 中 ， 除 了 Repository name 输 入 为 phpshop 外 ， 其 他 都 使 用 默认 值 。 单 击 Create responsitory 按 钮 即 可 成 功 创建 代码 仓库 ， 如 图 3-17 所 示 。 


忆 wangjialinbeijingy/ phpshop OUnwatchv 1 让 Star 


《> Code lssues 0 Pull requests 0 Projects 0 Wiki Kt Settings Insights ~ 


Quick setup — if you've done this kind of thing before 
呈 set up in Desktop OrjU HTTIPS SSH https://github.com/wangjialinbeijing/phpshop.Bit 


We recommend every repository include a README, LICENSE, and .gitignore. 


-or create a new repository on the command line 


echo "# phpshop” >> README ,md 

git init 

git add README .md 

git commit -mm "first commit" 

git remote add origin https://github.com/wangjialinbeijing/phpshop.git 
git push -u origin master 


.Or push an existing repository from the command line 


git remote add origin https://github.com/wangjialinbeijing/phpshop.git 
git push -u origin master 


.Or import code from another repository 


You can initialize this repository with code from a Subversion, Mercurial, or TFS project. 


Import code 


图 3-17 完成 代码 仓库 的 创建 


GitHub 提 示 这 是 一 个 空仓 库 ， 可 以 进行 克隆 (复制 ) 操作 ， 也 可 以 关联 本 地 的 库 进行 推送 操作 。 


0 


3.3.2 ”本 地 操作 远程 仓库 


为 上 面 的 实例 中 已 经 有 本 地 库 shop， 下 面 来 看 看 如 何 把 它 和 phpshop 进 行 关联 。 


首先 进入 本 地 库 shop 目 录 中 ， 执 行 以 下 命令 实现 与 远程 库 的 关联 : 


git remote add origin https://github.com/wangjialinbeijing/phpshop.git 


自 定义 的 origin 就 是 远程 库 的 名 称 ， 再 执行 以 下 命令 ， 把 本 地 仓库 的 代码 推送 上 去 ， 其 中 -u 参 数 表示 Git 会 关联 远程 的 master 分 支 到 本 地 分 支 ， 后 续 的 推送 操作 可 以 简化 为 以 下 命令 : 


git Push -u origin master 


执行 后 弹出 GitHub 的 登录 窗口 ， 如 图 3-18 所 示 。 


里 ) GiltHub Login 


GitHub 
LodgIn 


Username or emall 


(1) Please enter your username or email ad 


Password 


中 


关 ) Cancel 


Ws A 


Dont have an account? Sign up 
Forgot your password? 


图 3-18 ”提示 输入 GitHub 的 账号 与 密码 


输入 GitHub 账 号 与 密码 后 执行 登录 操作 ， 就 可 以 继续 推送 流程 ， 执 行 过 程 和 效果 提示 如 下 : 


$ git push -u origin master 

Counting objects: 3, done. 

Delta compression using up to 4 threads. 

Compressing objects: 100% (2/2), done. 

Writing objects: 100% (3/3), 282 bytes | 282.00 KiB/s, done. 
Total 3 (delta 0), reused 0 (delta 0) 

To https://github.com/wangjialinbeijing/phpshop.git 

* [new branch] master -> master 

Branch master set up to track remote branch master from origin. 


在 本 地 把 代码 推送 到 线 上 后 ， 在 GitHub 线 上 查看 代码 库 。 通 过 远程 仓库 查看 代码 ， 如 图 3-19 所 示 。 


ED wangjialinbeijing / phpshop Ounwatchv 1 廊 star 0 YrFork 0 


《> Code lssues 0 Pull requests 0 Projects 0 Settings Insights ~ 


Branch: master phpshop / index.php Find file Copy path 


区 wangjialinbeijing 首页 入 口 文 件 fce3769 8 days ago 


1 contributor 


3 lines (2 sloc) 51 Bytes Raw Blame History [mm | 


<?php 
echo “当前 的 时 间 :' .date('Y-m-d H:i:s'); 


图 3-19 ”在 GitHub 上 可 以 方便 地 查看 版 本 库 的 文件 详情 


除了 推送 本 地 仓库 到 远 端 ， 还 可 以 复制 远程 仓库 到 本 地 ， 这 里 模拟 一 台新 的 机 器 复制 phpshop 这 个 远程 版 本 库 到 本 地 ， 执 行 以 下 命 


git clone git@github.com:wangjialinbeijing/phpshop.git 


首次 命令 执行 过 程 中 会 看 到 有 警告 信息 ， 是 SSH 加 密 连 接 的 相关 确认 信息 ， 输 入 yes 后 按 回 车 键 即 可 继续 执行 ， 命 令 执 行 结果 如 下 : 


$ git clone git@github.com:wangjialinbeijing/phpshop.git 

Cloning into 'phpshop'http://www.hzcourse.com/resource/readBook?path=/openresources/teach ebook/uncompressed/17746/O0EBPS/Text/... 
The authenticity of host 'github.com (192.30.255.112)' can't be established. 
RSA key fingerprint is SHA256:nThbg6kXUPpJWG17El1IGOCspRomTxdCARLViKw 

6E5SY8. 

Are you sure you want to continue connecting (yes/no)? yes 

Warning: Permanently added 'github.com,192.30.255.112' (RSA) to the list 

of known hosts. 

remote: Counting objects: 3, done. 

remote: Compressing objects: 100% (2/2), done. 

remote: Total 3 (delta 0), reused 3 (delta 0), pack-reused 0 

Receiving objects: 100% (3/3), done. 


在 本 地 目录 下 查看 ， 远 程 版 本 库 的 内 容 已 经 同步 复制 到 本 地 ， 如 图 3-20 所 示 。 


Ci\phpStudy\WWWW\phpshop 


修改 日 期 


2017/8/30 15:12 
| | index.php 2017/8/30 15:12 PH 


图 3-20” ”GitHub 远程 仓 库 内 容 复制 到 本 地 


3.4 分支、 合并 与 冲突 解决 


Git 中 的 分 支 ， 本 质 上 是 个 指向 commit 提 交 对 象 的 可 变 指针 。 通 常情 况 下 ，Git 会 使 用 master 作 为 分 支 的 默认 名 字 。 在 多 次 提交 后 ， 开 发 者 默认 已 经 有 了 一 个 指向 最 后 一 次 提交 对 象 的 master 分 支 ， 而 
每 次 提交 时 都 会 自动 向 前 移动 。 同 时 Git 中 存在 一 个 名 为 HEAD 的 特殊 指针 ， 它 指向 正在 工作 的 本 地 分 支 。 


3.4.1 分支 与 合并 原理 


以 网 站 项 目 实际 开发 为 例 ， 该 项 目 最 初 只 有 master 分 支 (正式 站 点 ) ， 提 交 记 录 都 在 这 个 分 支 上 ， 所 以 HEAD 指 针 默 认 指向 master， 如 图 3-21 所 示 。 


后 来 该 项 目 需要 一 个 新 功能 ， 于 是 新 建 一 个 名 为 dev (新 功能 ) 的 分 支 ， 进 行 相应 的 开发 工作 ， 如 图 3-22 所 示 。 


master 


图 3-21 在 master 分 支 上 提交 代码 


图 3-22 ”创建 新 的 分 支 


dev 分 支 


但 此 时 工作 区 默认 还 在 master 分 支 下 ， 需 要 手动 切换 到 dev 分 支 ， 此 时 HEAD 指 针 就 会 指向 dev 分 支 ， 切 换 完成 后 工作 目录 也 就 变 成 dev 分 支 了 ， 此 时 dev 分 支 的 内 容 与 master 分 支 的 内 容 并 没有 不 同 ， 
都 指向 c3 次 提交 ， 如 图 3-23 所 示 。 


开发 者 于 是 继续 向 dev 分 支 上 提交 新 功能 代码 ， 时 间 轴 会 继续 前 进 ， 但 即便 是 版 本 提交 到 了 c5，master 分 支 的 指向 并 没有 发 生 改 变 (c3 节 点 ) ， 如 图 3-24 所 示 。 


图 3-23 ”切换 工作 区 到 dev 分 支 


Iaster 


图 3-24 在 dev 分 支 上 继续 提交 代码 


在 dev 分 支 上 执行 了 两 次 提交 后 ， 开 发 者 因为 某 些 原因 需要 切换 回 master 分 支 ， 继 续 进 行 其 他 开发 ， 此 时 项 目 提交 时 间 轴 就 会 流向 不 同 的 两 个 方向 ， 如 图 3-25 所 示 。 


随 着 dev 分 支 新 功能 的 开发 完毕 (提交 到 c5) 。 执 行 合并 操作 后 ，dev 分 支 的 历史 使 命 也 就 完成 ， 新 功能 也 合并 到 了 master 分 支 ， 开 发 者 可 以 选择 删除 dev 分 支 ， 此 时 时 间 轴 又 回归 到 了 master 分 支 ， 功 


能 也 上 线 到 了 正式 站 点 ， 如 图 3-26 所 示 。 
master 


dev 


不 过 合并 时 有 可 能 出 现 冲突 ， 这 个 就 需要 开发 者 手动 进行 解决 ， 详 细 内 容 后 面 会 再 介绍 。 


3-25 ”切换 回 master 分 支 继 续 提交 代码 


HEAD 


CORORORC4 oY 


dev 


图 3-26 ”进行 分 支 的 合并 操作 


3.4.2 ”分支 与 合并 实例 


以 前 面 讲 过 的 phpshop 版 本 库 为 例 ， 在 master 分 支 下 ， 只 有 一 个 index.php 文 件 作为 入 口 文件 。 模 拟 项 目 需要 开发 一 个 新 功能 ， 此 时 要 建立 新 的 分 支 ， 使 用 命令 如 下 : 


git branch dev 


执行 此 命令 成 功 后 ， 会 在 本 地 的 版 本 库 中 新 增 一 个 名 为 dev 的 分 支 ， 随 后 可 以 执行 相应 命令 查看 分 支 列表 : 


git branch 


执行 效果 如 下 : 


Phpshop git: (master) git branch 
dev 


* master 


在 分 支 列表 上 ， 看 到 带 有 “*” 符 号 前 缀 ， 说 明 此 分 支 正 在 使 用 中 ， 使 用 以 下 命令 切换 到 dev 分 支 : 


git checkout dev 


切换 成 功 后 ，git 后 面 的 master 已 经 换 成 dev， 结 果 如 下 : 


Phpshop git: (master) git checkout dev 
Switched to branch 'dev' 
Phpshop git: (dev) 


随后 在 dev 分 支 工 作 区 下 ， 创 建新 的 脚本 文件 function.php， 增 加 一 些 简 单 的 PHP 脚 本 代码 ， 实 现 模拟 对 新 文件 的 编辑 行为 ， 代 码 如 下 : 


<?php 
// 显示 标准 格式 化 日 期 
function show time() 
{ 
return date('Y-m-d H:i:s'); 
} 


执行 新 增 和 提交 命令 ， 输 出 结果 如 下 : 


$ git add function.php 

$ git commit -m ' 自 定义 函数 文件 ' 
[dev 8415ffc] 自 定义 函数 文件 

1 file changed，6 insertions (+) 
create mode 100644 function.php 


当 dev 分 支 的 开发 任务 结束 后 (编写 完成 function.php 文 件 ) ， 需 要 切换 回 master (主线 ) 分 支 进行 合并 操作 。 首 先 要 先 切换 到 master 分 支 ， 执 行 以 下 命令 : 


git checkout master 


切换 成 功 后 ， 会 发 现在 dev 分 支 下 开发 的 function.php 脚 本 文件 已 经 消失 不 见 ， 结 果 如 下 : 


$ git: (dev) git checkout master 

Switched to branch 'master' 

Your branch is up-to-date with 'origin/master'. 

$ git: (master) 11 

total 8 

-rw-r--r-- 1 wangjialin staff 51B 9 2 14:14 index.php 


执行 以 下 命令 ,合并 dev 分 支 到 master: 


$ git: (master) git merge dev 


Updating fce3709http://www.hzcourse.com/resource/readBook?path=/openresources/teach ebook/uncompressed/17746/OEBPS/Text/..8415ffc 


Fast-forward 

function.php | 6 + 二 十 二 二 十 

1 file changed，6 insertions (+) 
create mode 100644 function.php 


此 时 function.php 文 件 已 经 被 合并 过 来 ， 输 出 结果 如 下 : 


$ git: (master) 11 
total 16 


-rw-r--r-- 1 wangjialin staff 101B 9 2 14:43 function.php 
-rw-r--r-- 1 wangjialin staff 51B 9 2 14:14 index.php 


3.4.3 ”冲突 解 ; 


在 3.4.2 节 的 实例 中 ， 合 并 结果 是 比较 理想 的 情况 ， 


实际 项 目 中 这 样 的 应 用 场景 较 少 ， 大 部 分 时 候 情况 都 是 : 同一 个 文件 在 不 同 分 支 都 有 不 同 的 修改 ， 此 时 再 进行 合并 操作 ， 就 不 可 避免 地 会 出 现 各 类 冲突 。 


Git 在 发 现 冲突 时 ， 会 把 冲突 的 文件 内 容 标记 出 来 


这 里 模拟 一 个 冲突 的 发 生 ， 首 先 切 换 到 dev 分 支 ， 


同时 会 暂停 提交 行为 。 因 为 Git 无 法 决定 冲突 代码 的 修改 ， 所 以 需要 开发 者 手动 解决 冲突 后 ， 才 可 以 继续 下 一 步 提交 操作 。 
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修改 index.php 文 件 ， 代 码 如 下 : 


因为 在 dev 分 支 中 ， 未 对 原 有 master 分 支 的 中 的 index.php 脚 本 进行 修改 ，dev 分 支 也 只 是 新 增 了 function.php 文 件 ， 所 以 合并 时 互相 不 会 影响 。 但 在 


<?php 
// 删 除了 一 行 代码 


然后 在 dev 分 支 上 新 增 操作 后 提交 代码 ， 执 行 过 程 如 下 : 


$ git: (dev) git adqd . 

$ git: (dev) git commit -m=' 修 改 代码 ' 

[dev ad09881] = 修改 代码 

1 file changed, 1 insertion(+), 1 deletion 


(-) 


切换 到 master 分 支 后 ， 修 改 index.php 脚 本 文件 ， 代 码 如 下 : 
唱和 队 了 一 代码 
保存 代码 后 执行 如 下 新 增 提交 操作 ， 随 后 合并 dev 分 支 到 master 分 支 : 


$ git: (master) git merge dev 
Auto-merging index.php 


CONFLICT (content): Merge conflict in index.php 
Automatic merge failed; fix conflicts and then commit the result. 


此 时 Git 提 示 在 合并 时 ，index.php 文 件 出 现 了 冲 


突 ， 解 决 后 才 可 以 提交 。 此 时 使 用 编辑 器 打开 index.php 脚 本 文件 ， 发 现 格式 如 下 : 


<?php 
<<<<<<< HEAD 


// 我 也 删除 了 一 行 代码 


>>>>>>> dev 


在 返回 结果 中 可 以 发 现 ，Git 使 用 “<<<<<<<HEAD” 到 “=======” 的 符号 区 间 ， 标 识 master 分 支 下 修改 的 代码 , 使 用 “=======” 到 “>>>>>>>dev” 符 号 区 间 ， 标 识 dev 分 支 下 修改 的 


代码 。 解 决 冲突 需要 开发 者 手动 去 除 这 些 提示 符号 ， 


然后 手动 合并 代码 。 


编辑 index.php 文 件 ， 删 除了 无 用 的 内 容 后 ， 对 代码 进行 了 重新 组 合 ， 修 改 为 如 下 内 容 : 


<?Php 
// 解决 冲突 后 的 提示 语 : 删除 了 一 行 代码 


保存 脚本 文件 后 ， 在 master 分 支 下 进行 提交 操作 : 


$ git: (master) git add . 
$ git: (master) git commit -m=' 解 决 冲突 ' 
[master 37103e4] = 解决 冲突 


当然 实际 项 目 中， 冲突 的 类 型 和 数量 远 比 实例 中 复杂 ， 少 则 几 个 文件 ， 多 则 数 十 个 文件 。 在 解决 冲突 时 ， 需 要 根据 实际 情况 来 分 析 到 底 该 如 何 合并 代码 。 


第 4 章 “高效 团队 协作 


4.1 沟通 和 交流 很 重要 


沟通 和 交流 不 仅 对 技术 导向 型 的 企业 和 团队 很 有 


团队 的 规模 越 大 、 分 工 越 细致 ， 则 不 同 团队 协作 的 效率 就 会 因为 任务 分 配 、 沟 通 交 流 的 不 同 ， 甚 至 代码 托管 平台 的 不 同 而 产生 巨大 的 差异 。 为 了 更 好 地 提高 团队 协作 的 效率 ， 本 章 将 有 
团队 协作 工具 的 使 用 ， 也 为 一 些 初创 企业 和 团队 提供 经 验 参考 。 


要 ， 也 是 所 有 工作 开展 的 基础 。 


点 讲解 一 些 常 


4.1.1 术 业 有 专攻 一 一 企业 即时 通信 工具 
目前 在 国内 的 互联 网 行业 中 ， 出 现 了 微 信 、QQ 这 样 十 亿 用 户 级 别 的 巨 无 霸 即 时 通信 工具 。 我 们 的 生活 中 已 经 离开 不 了 这 些 工具 。 虽 然 很 多 人 使 用 微 售 、QQ 等 工具 交流 ， 但 在 一 些 细 分 领域 ， 依 旧 有 其 


他 的 沟通 软件 存在 ， 其 中 包含 一 些 专门 服务 于 企业 交流 的 软件 和 工具 。 


企业 或 者 团队 应 该 以 能 够 提高 工作 效率 为 目标 ， 对 应 不 同 的 应 


1. 创 业 公 司 和 初创 团队 的 选择 方案 
如 果 没有 特殊 的 要 求 ， 普 通 的 即时 通信 软件 〈( 如 微 信和 QQ) 就 可 以 覆盖 这 部 分 群体 。 这 些 工 
具 大 部 分 都 出 自 于 腾讯 和 阿里 巴巴 (如 图 4-1 所 示 ) ， 大 部 分 读者 应 该 对 这 些 软件 都 不 陌生 。 


场景 ， 选 择 适 合 的 即时 通信 工具 。 


根据 


不 仅 受 众 / 


生活 中 常见 的 即 上 有 


、 跨 平台 方便 ， 而 | 


通信 软件 


图 4-1 
不 过 这 些 工具 若 在 工作 时 使 用 ， 容 易 导 致 工作 和 生活 无 法 分 离 。 对 于 初创 公司 ， 这 些 都 不 是 最 重要 的 影响 
2. 中 小 企业 的 选择 方案 
这 些 企业 的 人 数 相 比 初创 团 
于 ， 如 果 同 时 使 用 过 多 的 工具 ， 则 会 影响 效率 ， 若 可 以 在 一 个 系统 里 无 颖 对 接 ， 无 疑 将 会 大 为 提高 效率 。 
这 里 主要 推荐 阿里 的 钉 钉 和 腾讯 的 企业 微 信 两 种 即时 通信 工具 ， 如 图 4-2 所 示 。 


司 规模 、 团 队 性 质 和 工作 


目 基本 上 没有 使 有 


草 QQPC 版 是 GD 信 


队 要 多 很 多 ， 都 在 几 十 人 甚至 上 百人 不 等 。 在 工具 的 选择 上 ， 则 更 加 侧重 于 某 些 功能 ， 比 如 是 否 可 以 进行 考勤 的 管理 ， 能 和 否 进行 报销 和 审批 等 。 当 人 数 


内 容 的 不 同 ， 选 择 也 不 同 ， 以 下 是 常见 的 几 种 选择 方案 。 


担心 其 稳定 性 。 


内 有 名 的 普通 即时 通信 工 


成 本 ， 也 不 上 


信 


阿里 旺旺 


素 ， 降 低 成 本 和 减少 沟通 障碍 才 是 第 一 要 务 ， 毕 竟 活 下 来 才能 可 持续 发 展 。 


图 4-2 主流 的 企业 即时 通信 工具 


(1) 钉 钉 


钉 钉 和 企业 微 信 在 产品 定位 上 各 有 不 同 ， 使 用 钉 钉 的 优势 有 如 下 : 


“ 每 条 消息 都 有 已 读 、 未 读 状态 标识 。 
:网 盘 、 邮 件 、 电 话 、 考 勤 和 审批 功能 深度 集成 。 
“ 进一步 地 细 分 用 户 角色 。 

“ 支持 第 三 方 应 用 市 场 和 接口 ， 强 调 扩 展 性 。 


“ 支持 阿里 系 工具 ， 如 支付 宝 等 。 


自 上 而 下 的 执行 力 (强调 阅读 回执 ) ， 但 其 功能 全 面 、 


钉 钉 强调 的 是 


复杂 ， 也 在 一 定 程度 上 提高 了 


户 上 手 的 成 本 ， 这 让 钉 钉 更 适合 IT 互联 网 企业 。 


钉 钉 移 到 


4-3 所 示 。 


(2) 企业 微 信 


与 钉 钉 的 产品 定位 不 同 ， 企 业 微 信 刚 起 步 ， 其 优势 如 下 : 
“ 使 用 习惯 类 似 微 信 ， 用 户 可 以 无 颖 上 手 ， 门 槛 低 。 

“ 可 以 批量 地 导出 聊天 记录 和 文件 。 

“ 具有 强大 的 企业 通信 录 和 外 部 联系 人 。 

“ 具有 开放 的 API 接 口 。 


' 支持 腾讯 系 工具 ， 如 QQ 企业 邮箱 等 。 


对 比 钉 钉 的 执行 力 ， 企 业 微 信 更 强调 沟通 的 本 质 ， 尤 其 像 “ 下 班 了 ”功能 ， 可 以 实现 工作 和 生活 的 分 离 。 企 业 微 信 移 动 端 界 面 如 


4-4 所 示 。 


电话 会 议 
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图 4-3 ”人 钉 钉 移动 端 中 的 实用 功能 


二 二 生生 中 国电 信 胎 ' 13:30 


《“ 我 工作 台 


公费 电话 


企业 邮箱 


各 
加 sa 


图 4-4 ”企业 微 信 移动 端 界面 


无 论 是 更 看 重 执行 力 的 钉 钉 ， 还 是 更 加 “人 性 化 ”的 企业 微 信 ， 只 要 可 以 提高 企业 或 者 团队 的 沟通 效率 ， 就 是 好 工具 。 


人 提示 : 无 论 是 钉 钉 还 是 企业 微 信 ， 都 是 有 全 平台 的 客户 端 可 供 使 用 ， 所 以 不 用 担心 系统 ， 只 需要 根据 功能 选择 即 可 。 


4.1.2 ”文档 积累 和 文件 分 享 


在 团队 协作 中 ， 知 识 的 积累 非常 重要 ， 却 往往 总 是 被 忽视 。 若 可 以 把 平时 工作 中 的 讨论 、 修 改 历史 、 问 题解 决 的 方案 ， 都 以 笔记 和 文档 的 形式 整理 出 来 ， 新 人 就 可 以 更 好 地 融入 到 团队 中 去 ， 提 高 工作 
效率 。 


1. 文 档 编写 与 协同 操作 


挑选 合适 的 文档 协同 工具 ， 需 要 考虑 到 以 下 几 点 : 
“ 支持 多 人 协作 编写 同一 份 文档 。 

' 支持 主流 的 文件 格式 。 

“ 支持 版 本 修改 记录 。 

' 支持 评论 与 分 享 。 


: 有 较 好 的 用 户 体验 。 


在 这 里 推荐 石墨 文档 ， 基 本 上 可 以 满足 以 上 的 要 求 ， 石 墨 文档 号 称 “ 最 优美 的 在 线 协 作文 档 ”， 在 写 文档 时 ， 不 仅 支 持 Markdown 的 部 分 语法 ， 在 协作 、 评 论 、 修 改 历史 和 编写 人 员 方 面 也 是 一 应 俱 
全 ,文档 的 编写 体验 优异 。 


访问 地 址 : https://shimo.im， 可 以 方便 地 注册 和 使 用 石墨 文档 ， 一 切 都 是 线 上 操作 ， 无 需 下 载 和 安装 本 地 客户 端 。 另 外 ， 石 墨 文 档 还 可 以 和 钉 钉 协作 ， 提 高 工作 效率 。 石 墨 文档 的 管理 界面 如 图 4-5 所 
示 ， 简 约 的 设计 风格 非常 讨 喜 。 


geo 而 PHPe0oK nt 人 
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图 4-5 石墨 文档 的 管理 界面 


文档 的 编辑 效果 如 图 4-6 所 示 。 


git commit 
git pull 
git push 
git dif 
git status 


见 的 文档 格式 都 支持 。 


图 4-6 ”丰富 的 格式 和 文档 评论 


除 此 之 外 ， 还 可 以 进行 多 成 员 的 协同 编辑 ， 操 作 上 只 需要 添加 协作 者 账号 即 可 ， 如 图 4-7 所 示 。 需 要 注意 ， 协 作者 要 求 是 已 经 注册 完成 的 石墨 文档 


协作 者 (1) 


G3 wangjialin (我 ) 


图 4-7 文档 编辑 时 可 以 方便 地 添加 协作 者 


另外 ， 还 可 以 导入 本 地 的 文件 ， 微 软 办 公 套 件 里 面 的 常见 文件 格式 基本 上 都 支持 ， 如 Word 和 Excel 文 件 格式 ， 后 续 还 会 支持 PPT 格 式 。 越 来 越 多 文档 通用 格式 的 增加 ， 减 少 了 因为 线 下 和 线 上 格式 不 统 


一 导致 的 额外 工作 量 。 


件 ， 


全 提示 : 对 文档 安全 性 要 求 较 高 的 用 户 ， 可 以 尝试 在 本 地 搭建 局 域 网 文件 管理 系统 。 


2.: 文 件 存储 与 分 享 


企业 和 团队 因为 工作 性 质 的 不 同 ， 所 需要 的 文件 存储 与 分 享 的 方式 也 不 尽 相 同 。 例 如 ， 一 些 参与 影视 制作 的 公司 ， 素 材 源 代码 多 以 TB (1TB=1024GB) 为 单位 。 而 另外 一 些 技术 团队 ， 则 需要 特定 的 文 
随时 可 以 在 任何 地 方 进 行 编辑 。 可 见 不 同 性 质 的 团队 ， 对 于 文件 存储 的 要 求 也 是 不 一 样 的 ， 如 何 选择 成 本 更 低 、 更 合适 的 存储 方式 ， 都 是 一 个 值得 思考 的 问题 。 


目前 主流 的 企业 级 文件 存储 ， 主 要 分 为 以 下 两 种 。 


(1) 在 线 网 盘 


国内 的 在 线 网 盘 ， 服 务 商 如 七 牛 云 、 百 度 网 盘 、 坚 果 云 和 阿里 云 等 都 有 对 应 的 网 络 存储 服务 ， 根 据 用 户 对 文件 存储 大 小 和 流量 的 需求 ， 收 费 也 不 同 。 可 以 通过 外 网 进行 访问 的 文件 存储 ， 主 要 应 对 以 下 


“ 第 三 方 网 意 容量 成 本 高 ， 一 般 除 了 按 容量 收费 外 ， 还 需要 按照 使 用 时 长 收费 ， 所 以 适合 用 户 的 文件 总 数 小 、 容 量 低 的 场合 。 
第 三 方 网 盘 一 般 都 会 按照 访问 流量 和 使 用 带宽 进行 收费 ， 所 以 需要 用 户 对 下 载 和 上 传 的 速度 无 过 多 要 求 。 


“ 因为 在 外 网 ， 文 件 传输 的 安全 性 不 如 本 地 局 域 网 ， 所 以 需要 用 户 无 特殊 安全 性 要 求 。 


因为 不 需要 自行 购买 服务 器 ， 文 件 的 存储 空间 也 可 以 是 弹性 增长 的 ， 对 于 一 般 的 团队 ， 文 件 体 量 不 大 的 ， 完 全 可 以 选择 在 线 网 盘存 储 ， 这 样 不 仅 节约 成 本 ， 体 验 的 使 用 上 也 不 会 太 差 。 


另外 ， 国 外 的 Google、 亚 马 逊 等 也 提供 优质 的 网 盘 服务 ， 不 过 : 


访问 速度 和 稳定 性 等 肯定 不 如 国内 网 盘 ， 对 网 络 访问 请 求 要 求 较 高 的 用 户 尽量 选择 国内 的 服务 商 。 


国内 常见 的 网 盘 服 务 商 ， 如 图 4-8 所 示 。 


图 4-8 内 常见 的 网 盘 服务 商 


局 域 网 文件 服务 器 


DN 
= 


在 局 域 网 内 搭建 的 文件 服务 器 ， 不 对 外 开放 ， 其 安全 性 相 比 网 盘 有 了 很 大 的 提高 ， 适 合 以 下 应 用 场景 : 


“ 文件 存储 量 大 ， 如 一 些 影视 素材 和 备份 文件 等 。 
“ 更 高 的 安全 性 要 求 。 
“局域网 内 访问 更 快 的 下 载 、 上 传 速度 。 


“ 存储 硬件 的 选择 更 为 灵活 ， 除 了 使 用 硬盘 ， 甚 至 可 以 使 用 磁带 (企业 级 存储 ) 和 蓝光 光盘 等 存储 介质 。 


搭建 局 域 网 的 文件 服务 器 ， 除 了 使 用 一 般 的 应 用 服务 器 改造 外 ， 还 可 以 使 用 专门 的 硬件 进行 存储 ， 如 NAS。NAS 的 全 称 是 网 络 连接 存储 设备 (Network Attached Storage) ， 是 一 种 专门 的 数据 存储 
技术 的 名 称 ， 它 可 以 直接 连接 在 计算 机 网 络 上 ， 对 异 质 网 络 用 户 提供 了 集中 式 数据 访问 服务 。NAS 和 一 般 的 应 用 服务 器 没有 本 质 区 别 ， 无 论 是 局 域 网 还 是 外 网 ， 都 可 以 方便 地 访问 ， 用 户 可 以 根据 实际 需求 
自行 搭配 。 


除了 使 用 专用 的 硬件 ， 一 些 团队 也 会 直接 在 Linux 系 统 下 搭建 文件 服务 器 。 最 简单 的 方法 就 是 使 用 Apache+ HTTP 的 方式 进行 文件 传输 ， 这 样 只 需要 修改 Apache 的 文件 权限 ， 就 可 以 让 开发 者 直接 查 
看 、 下 载 服务 器 的 根 目录 。 


人 提示: 无 论 是 购买 专门 的 文件 存储 硬件 ， 还 是 在 PC 硬件 上 搭建 文件 服务 器 ， 都 需要 文件 存储 系统 的 支持 。 


4.2 ”任务 分 配 、 代 码 托管 和 缺陷 管理 


企业 或 者 团队 的 人 员 越 多 ， 分 工 越 详细 ， 越 需要 各 式 各 样 的 工具 软件 以 辅助 工作 ， 本 节 主 要 讲解 在 不 同 的 工作 场景 下 ， 都 需要 哪些 工具 ， 以 便 更 好 地 提高 工作 效率 。 


4.2.1 任务 分 配 


在 工作 中 ， 若 直接 通过 邮件 、 文 档 进行 任务 分 配 ， 在 产品 或 者 项 目 进行 时 ， 无 法 及 时 跟踪 项 目的 进度 ， 人 力 成 本 会 被 极 大 地 浪费 掉 。 所 以 一 般 的 企业 或 者 团队 都 会 选择 任务 管理 系统 ， 对 人 员 进 行 任务 
分 配 和 跟踪 ， 可 以 方便 地 及 时 跟 进 整个 项 目的 进展 。 


除了 对 任务 进行 管理 外 ， 无 论 是 使 用 SVN， 还 是 Git 进 行 代码 的 版 本 控制 ， 一 般 都 会 搭建 集中 的 代码 仓库 ， 以 实现 团队 之 间 的 代码 共享 。 


而 在 项 目 进行 中 ， 测 试 团队 还 需要 及 时 地 编写 测试 用 例 ， 向 缺陷 管理 系统 提交 问题 反馈 ， 也 就 是 我 们 常 说 的 bug 管 理 。 


以 上 几 种 管理 系统 ， 在 实际 项 目 中 ， 可 以 说 是 缺 一 不 可 。 如 今 企业 服务 的 市 场 越 来 越 大 ， 老 牌 和 新 生 的 团队 协作 工具 越 来 越 丰 富 ， 以 下 是 一 些 常见 的 主打 任务 管理 的 团队 协作 工具 ， 如 图 4-9 所 示 。 


a Worktile 


teambition 


四 Tell0 明 ] 开放 沟通 局 平 协作 


图 4-9 ”常见 的 团队 协作 管理 工具 


人 提示: 以 上 几 种 管理 工具 ， 很 多 都 集成 了 除 任务 管理 外 的 其 他 功能 ， 用 户 可 以 根据 实际 的 需求 自行 对 比 选择 。 


4.2.2 ”代码 托管 


代码 托管 工具 的 选择 ， 需 要 具体 问题 具体 分 析 。 代 码 托管 跟 文件 管理 非常 类 似 ， 根 据 团队 需求 和 项 目 类 型 ， 有 以 下 常见 的 两 种 选择 : 


: 在 线 代 码 托管 服务 平台 。 


“局域网 代码 托管 服务 平台 。 


这 里 以 Git 作 为 基础 的 版 本 管理 工具 ， 主 要 推荐 两 个 在 线 代码 托管 服务 平台 : 
: GitHub 


* Bitbucket 


GitHub 免 费 提供 的 仓库 都 是 公共 的 ， 私 人 仓库 需要 每 月 付费 。 与 GitHub 不 同 ，Bitbucket 对 免费 用 户 只 提供 无 限 的 私有 仓库 。 所 以 ， 如 果 项 目 是 开源 的 ， 可 以 公开 访问 ，GitHub 是 首选 。 若 需要 尽 可 能 
低 成 本 地 获取 私有 仓库 ， 可 以 试 一 试 Bitbucket。 


GitHub 与 Bitbucket 的 标志 ， 如 图 4-10 所 示 。 


ATLASSIAN 


BBitbucket 


图 4-10 主流 的 在 线 代码 托管 服务 平台 


由 于 使 用 在 线 服务 平台 ， 并 不 能 满足 所 有 的 团队 需求 ， 当 团队 人 员 快 速 增长 、 项 目 规模 不 断 扩 张 后 ， 在 线 服务 平台 终究 会 因为 网 络 访问 速度 、 代 码 仓库 容量 大 小 限制 等 ， 降 低 使 用 体验 。 除 此 之 外 ， 有 
的 企业 的 核心 代码 ， 对 保密 性 要 求 很 高 ， 直 接 就 禁止 外 网 访问 ， 遇 到 这 种 情况 ， 就 需要 自行 搭建 私有 服务 ， 实 现 局 域 网 内 的 代码 托管 。 


tLa 


图 4-11 ”GitLab 的 Logo (有 点 儿 像 一 个 狐狸 头 ) 


私有 的 开源 代码 托管 工具 很 多 ， 这 里 推荐 使 用 GitLab， 其 Logo 如 图 4-11 所 示 。 


GitLab 是 一 个 使 用 Ruby on Rails 语 言 开发 的 开源 应 用 程序 ， 实 现 一 个 自 托管 的 Git 项 目 仓库 ， 可 通过 Web 界 面 访问 公开 或 者 私人 的 项 目 。 


它 拥 有 与 GitHub 类 似 的 功能 ， 能 够 浏览 源 代码 、 管 理 缺陷 和 注释 ， 可 以 管理 团队 对 仓库 的 访问 ， 非 常 易于 浏览 提交 过 的 版 本 并 提供 一 个 文件 历史 库 。 团 队 成 员 可 以 利用 内 置 的 简单 聊天 程序 (Wall) 进 
行 交流 ， 它 还 提供 了 一 个 代码 片段 收集 功能 可 以 轻松 实现 代码 复 用 ,便于 日 后 有 需要 时 进行 查找 。 


在 GitLab 中 创建 私有 项 目 ， 如 图 4-12 所 示 。 


项 目 路 径 项 目 名称 
http://192.168.33.33/ root my-awesome-project 


希望 将 几 个 相关 联 的 项 目 放 置 于 同一 个 命名 空间 下 ”创建 群 组 


项 目 描述 (可 选 ) 
说 明 格式 
可 见 等 级 @ 
引 曙 私有 
项 目 访问 权限 必须 明确 授权 给 每 个 用 户 。 
加 内 部 
该 项 目 允 许 已 登录 的 用 户 访问 。 
@ 公开 
该 项 目 允 许 任何 人 访问 。 


图 4-12 ”在 GitLab 上 创建 私有 项 目 


公所 示 : 说 GitLab 就 是 一 个 局 域 网 特色 版 的 GitHub， 也 不 足 为 过 。 不 过 在 使 用 和 设计 理念 上 ， 两 者 还 是 有 很 多 的 不 同 。 
4.2.3 ”缺陷 管理 


缺陷 管理 其 实 就 是 我 们 常 说 的 bug 管 理 ， 在 整个 项 目 周 期 中 ， 测 试 人 员 都 会 把 测试 问题 反馈 到 系统 上 ， 并 根据 开发 人 员 对 问题 解决 的 进度 进行 追踪 。 开 发 过 程 中 ， 常 见 的 是 “提交 bug， 修 改 bug” 过 
程 ， 如 图 4-13 所 示 。 


缺陷 管理 系统 主要 的 目的 就 是 为 了 保障 项 目的 质量 ， 防 止 


为 重大 缺陷 (bug) 导致 的 系统 故障 和 不 必要 的 损失 。 目 前 除了 专门 的 缺陷 管理 系统 ， 很 多 任务 管理 系统 都 自 带 缺陷 管理 模块 ， 甚 至 GitLab 


也 有 “问题 ”模块 对 应 缺陷 管理 。 如 果 对 系统 功能 要 求 不 高 ， 可 以 直接 用 GitLab 当 作 bug 的 管理 系统 ， 结 合 代码 仓库 ， 以 提高 问题 修复 的 效率 ， 如 图 4-14 所 示 。 


测试 人 员 反 馈 问 题 


开发 人 员 解 决 问题 
开始 


图 4-13 


问题 提交 与 修复 流程 


未 关闭 3 已 关闭 0 所 有 3 
S 搜索 或 者 过 滤 结 果 .. 
商品 详情 页 提升 加 载 速度 


#3 . opened 10 分 钟 前 by Administrator 


#2 . opened 
列表 加 载 图 片 异 常 
#1. opened 11 分 钟 前 by Administrator 前 2017-09-23 


项 目 版 本 库 间 题 3 


合并 请 求 0 流水 线 维基。 代码 片段 


成 员 


列表 ”看板 ”标记 里程碑 


入 


最 近 创 建 的 
» 
更 新 于 10 分钟 前 


全 
更 新 于 11 分 钟 前 


泌 号 0 
更 新 于 11 分 钟 前 


GD 


4.3 ”在 线 协作 绘制 流程 图 一 一 ProcessOn 


图 4-14 在 GitLab 中 进行 问题 的 反馈 与 追踪 


开发 团队 在 进行 实际 开发 前 ， 通 常 要 整理 系统 逻辑 与 开发 思路 ， 这 少不了 各 种 流程 图 和 思维 导 图 ， 这 些 绘制 图 也 是 各 种 文档 中 的 核心 部 分 。 绘 制 一 个 通俗 易 懂 、 简 约 好 看 的 流程 图 ， 也 是 开发 者 必 备 的 
实用 技能 。 
4.3.1 ProcessOn 简 介 

为 了 便于 理解 ， 好 的 文档 都 会 配 上 丰富 的 图 例 ， 如 流程 图 、UML 用 例 图 和 思维 导 图 等 。 开 发 者 绘制 通俗 易 懂 的 图 例 ， 需 要 选择 合适 的 绘图 工具 ， 这 里 推荐 一 个 好 用 的 网 页 流程 图 工具 一 一 ProcessOn， 


使 用 该 工具 不 仅 可 以 绘制 常见 的 流程 图 


-思维 导 图 ; 


“原型 图 ; 


* UML; 


“网络 拓扑 图 ; 


“ 组 织 结构 


这 些 图 的 格式 类 型 ， 基 本 上 可 以 满足 一 般 使 用 者 的 需求 。 除 了 这 些 基 本 的 格式 外 ， 


灵活 选择 。ProcessOn 的 管理 界面 如 图 4-15 所 示 。 


， 而 且 官 方 还 提供 了 很 多 其 他 的 图 片 格式 : 


ProccessOn 还 提供 了 模板 市 场 (分 为 免费 模板 和 收费 模板 ) ， 好 的 模板 ， 可 以 一 键 复制 到 自己 的 文件 夹 内 ， 方 便 用 户 


我 的 文件 > BOOK 


导入 


© 流程 图 
@ as 四 


原型 图 充 发 布 文章 流 也 基础 模型 与 自 定义 模型 。 ”点 提 BUG 与 改 BUG “团队 常见 文档 上 未 命 名 文件 


(G3) UML 


@ 网 络 拓扑 图 


Ce 各 结 p 轿 ry | |- 
© BPMN 


更 多 图 形 和 模版 >> 


品 新 GitLab 工 作 流 此 一 个 新 的 流程 图 中 在 GitLab 上 发 布 问 题 总 Apache 与 Nginx 解 析 P.… 


图 4-15 ”使 用 ProcessOn 创 建 流程 图 
总 的 来 说 ， 使 用 ProcessOn 的 优点 如 下 : 
“无需 安 装 ， 直 接 使 用 ; 
“ 可 以 协同 开发 ; 
“ 收费 版 价格 相对 较 低 ; 
“ 模板 市 场 丰富 。 


人 提示 : 若 没有 特别 说 明 ， 本 书 中 大 部 分 的 思维 导 图 、 流 程 图 等 都 是 使 用 ProcessOn 绘 制 的 。 


4.3.2 ”ProcessOn 操 作 指南 


这 里 以 绘制 流程 图 类 型 为 例 ， 讲 解 如 何 快速 使 用 ProcessOn 绘 图 工具 ， 具 体操 作 步 又 如 下 。 


(1) 注册 账号 


账号 注册 没有 门槛 ， 访 问 地 址 : https://processon.com/signup， 即 可 快速 注册 ,免费 用 户 可 以 创建 的 模板 数量 有 限 ， 若 平时 经 常 绘制 各 种 


史 


形 ， 建 议 升级 到 付费 版 本 。 


(2) 创建 流程 图 空 模板 


在 用 户 管理 首页 ， 单 击 “ 新 建 ”命令 后 出 现 模板 类 型 列表 ， 选 择 “流程 图 ”后 ， 进 入 图 例 的 操作 台 ， 如 图 4-16 所 示 。 


i 性、 

| 4 未 命名 文件 下 载 | | 发 布 | 分 享 dz5362 ~ 
| 文件 编辑 视图 插入 页 面 排列 帮助 
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| 
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| 用 
弟 
名 
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口 
四 
[| 


| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 


|- Cl AOE 


| 


at+ 邀请 协作 者 人 给 我 们 评 个 分 ? | @ 关注 我 们 ”帮助 中 心 


4-16 进入 操作 台 绘制 流程 图 


执行 完 以 上 操作 ， 一 个 空 的 模板 就 创建 完毕 了 ， 使 用 者 熟悉 一 下 相应 的 功能 ， 就 可 以 绘制 所 需要 的 流程 图 了 。 


(3) 新 建 图 形 


在 操作 台 上 的 左 侧 “基础 图 形 ” 中 ， 任 何 图 形 都 可 以 直接 拖 搜 (选择 图 形 后 按 住 鼠 标 左 键 不 放 ) 到 画布 上 。 例 如 ， 先 选择 “Flowchart 流 程 图 ”， 拖 搜 “开始 / 结 束 ”图 形 到 画布 ， 用 鼠标 双击 图 形 则 可 
以 输入 名 称 ， 例 如 ， 输 入 “开始 ”文本 ， 如 图 4-17 所 示 。 


选中 图 形 后 ， 可 以 发 现 顶 部 的 属性 栏 可 以 操作 了 ， 当 前 图 形 的 属性 都 可 以 自 定义 ， 其 中 包含 图 形 的 大 小 、 线 条 和 背景 颜色 、 内 置 字体 大 小 、 所 在 位 置 等 属性 ， 如 图 4-18 所 示 。 


图 4-17 开始 绘制 流程 图 


微软 雅 黑 


图 4-18 ”修改 图 形 的 颜色 、 字 体 和 大 小 


在 图 形 上 有 四 个 圆 点 ， 鼠 标 单 击 后 向 外 拖 搜 ， 可 以 选择 创建 流程 指向 的 下 一 个 图 形 。 选 中 图 形 间 的 连 线 ， 可 以 灵活 地 自 定义 该 连 线 的 类 型 ， 如 图 4-19 所 示 。 


ruA- 雪 区 - 凤 - 三 -去 志 :- 一 -一 >- 和 有 
v 


执行 第 一 个 步骤 


这 


4-19 自 定义 图 形 连 线 的 属性 


(5) 快速 复制 已 有 图 形 


选中 任意 图 形 或 连 线 ， 单 击 鼠 标 右键 ， 可 以 弹出 快捷 菜单 ， 方 便 进 行 复制 等 操作 ， 如 图 4-20 所 示 。 


Ctrl+X | 
| 让 复制 Ctr+C | - 了 第 一 个 步骤 
复 用 Ctrl+D \ O 
呈 置 于 顶层 Ctrl+] 


| 


形 


4-20 快速 复制 已 有 


(6) 完成 流程 图 绘制 


选中 复制 出 的 副本 图 形 ， 手 动 修改 其 所 在 位 置 ， 完 成 流程 图 的 绘制 ， 如 图 4-21 所 示 。 


执行 第 一 个 步骤 执行 第 二 个 步骤 


图 4-21 完成 流程 图 的 绘制 


(7) 保存 流程 图 到 本 地 


单 击 操作 台 右上 角 的 “下 载 ”按钮 ， 在 弹出 的 菜单 中 ， 选 择 需要 保存 的 文件 格式 ， 然 后 单 击 “ 确 定 ”按钮 后 即 可 自动 下 载 ， 如 图 4-22 所 示 。 


下 载 格式 


@ 图 片 文件 (*.png) 将 文件 导出 为 图 片 

日 PDF 文件 (*.pdf) 由 图 片 保存 成 的 PDF 文件 

日 PDF 文件 (*.pdf) “导出 高 清 PDF 文件 ( 仅 支 持 部 分 字体 样式 ) 
日 POS 文 件 (*.pos) 包含 图 片 与 图 形 结构 定义 (可 导入 ) 


SVG 文 件 (*.svg) 导出 为 SVG 矢 量 图 形 


4-22 ”可 供 选 择 的 文件 保存 格式 


人 提示 : 保存 高 清 格式 图 片 ， 建 议 选 择 “PDF 文件 (高清 ) ”和 “SVG 文件 ”。 


(8) 在 线 保存 流程 图 源 文件 


在 操作 台 的 左上 方 ， 双击“ 未 命名 文件 ”可 以 修改 标题 ， 再 次 单 击 即 可 保存 ， 如 图 4-23 所 示 。 


m 完整 的 流程 图 名 称 
文件 编辑 视图 插入 页 面 排列 帮助 。 ”所 有 更 改 已 保存 


图 4-23 ”ProcessOn 会 自动 保存 修改 
返回 到 用 户 管理 中 心 ， 发 现 文件 已 经 被 保存 成 功 。 


人 提示 : 每 一 个 步 台 者 会 自动 保存 ， 所 以 即使 关闭 了 浏览 器 教 据 还 是 会 保存 在 线 上 。 


4.3.3 ”ProcessOn 多 人 协作 


有 时 候 ， 绘 制 的 流程 图 可 能 需要 进行 用 户 版 本 发 布 、 小 组 讨论 等 ， 这 时 候 就 需要 更 多 的 人 参与 其 中 ， 实 现 文件 的 评审 和 发 布 等 。ProcessOn 多 人 协作 的 模块 被 称 为 小 组 ， 使 用 流程 如 下 。 
(1) 创建 小 组 


首先 在 用 户 管理 中 心 ， 单 击 项 部 导航 栏 菜单 中 的 “小 组 ”按钮 ， 随 后 创建 一 个 新 的 小 组 名 “我 的 团队 ”， 如 图 4-24 所 示 。 


我 的 团队 ProcessOn 用 户 组 


新 建 小 组 


图 4-24 ”在 ProcessOn 中 新 建 小 组 
(2) 小 组 成 员 邀 请 


进入 新 创建 的 小 组 ， 单 击 界面 右上 方 的 “小 组 设置 ”按钮 (齿轮 图 标 ) ， 可 以 进行 小 组 成 员 的 邀请 等 操作 ， 如 图 4-25 所 示 。 
Tr mm 
Q AZ 多 人 := 
二 本 [LT 


编辑 小 组 


小 组 信息 方式 1: 小 组 专属 邀请 链接 ， 复 制 后 分 享 给 您 的 好 友 ， 遵 请 他 们 加 入 
小 组 成 员 您 还 没有 给 小 组 创建 邀请 链接 

邀请 成 员 创建 链接 

小 组 升级 


方式 2: 输入 邮箱 来 发 送 邀 请 ， 通 过 逗号 、 空 格 或 回 车 键 来 添加 多 个 
删除 小 组 


请 在 此 输入 邮箱 ， 回 车 添加 


图 4-25 ”通过 邀请 的 方式 添加 小 组 成 员 


(3) 小 组 成 员 权 限 分 配 


通过 邮箱 的 方式 邀请 小 组 内 的 成 员 ， 当 组 员 通 过 之 后 ， 默 认 权限 为 “订阅 者 ”， 在 此 权限 下 ， 只 能 


某 个 成 员 进行 权限 的 分 配 ， 如 图 4-26 所 示 。 


编辑 小 组 
小 组 信息 成 员 列 表 
| 小 a 成 a 昵称 加 入 时 间 
邀请 成 员 dz5362 2017-09-08 
小 组 升级 小 组 成 员 -李晓明 2017-09-15 
删除 小 组 
没有 更 多 


角色 


创建 者 


编辑 者 Y 三 


作者 可 以 在 小 组 中 创建 、 编 辑 自己 的 文件 ， 


并 且 可 以 查看 其 他 成 员 的 文件 


查看 文件 ， 不 能 修改 文件 。 若 想 提升 小 组 成 员 的 权限 ， 需 要 小 组 创建 者 在 “小 组 成 员 ” 列 表 中 ， 选 中 


(4) 协同 操作 


在 分 配 权限 时 ， 除 了 “订阅 者 ”之 外 的 角色 都 可 以 对 图 形 模板 进行 修改 ， 


图 4-26 


ProcessOn 本 身 的 功能 十 分 强大 ， 除 了 不 


外 ， 对 其 他 图 形 的 支持 也 很 好 ， 开 发 者 可 以 根据 自己 的 需求 灵活 选择 ， 以 实现 最 高 的 开发 效率 。 


人 提示 : 虽然 ProcessOn 文 件 都 存储 在 线 上 ， 但 建议 还 是 多 备份 文件 到 本 地 ， 以 防止 不 必要 的 损失 。 


4.4 ”GitLab 操 作 全 攻略 


全. 
ap 


4.4.1 


令 行 、 脚 本 的 使 


集成 了 代码 管理 、 缺 陷 管理 、 任 务 管理 和 


安装 与 汉化 


编译 安装 GitLab 所 需 的 依赖 较 多 ， 过 程 也 较为 烦琐 ， 为 了 简化 流程 ， 这 里 使 


1.GitLab 安 装 


这 里 还 是 在 Windows 环 境 下 ， 搭 建 虚拟 机 来 完成 GitLab 的 安装 调试 。 


(1) 配置 虚拟 机 


使 用 Vagrant 配 置 一 个 Ubuntu16.04 的 虚拟 机 环境 ， 并 且 设 置 私有 IP 地 址 为 : 192.168.33.33， 


(2) 安装 依赖 包 


执行 以 下 命令 : 


上 的 小 技巧 ， 让 使 


小 组 成 员 默 认 拥 有 “订阅 者 ”的 权限 


此 时 就 可 以 方便 地 进行 多 人 协同 操作 了 。 


安装 本 地 客户 端 外 ， 全 程 在 线 自动 保存 也 防止 了 文件 的 丢失 。 另 外 ， 本 节 中 的 实例 只 是 Processon 的 基础 入 门 实例 ，ProcessOn 本 身 除 了 可 以 绘制 流程 


自动 部 署 等 功能 的 GitLab， 是 团队 协作 首选 的 协作 工具 。 不 过 GitLab 相 比 其 他 的 任务 管理 工具 ， 在 安装 和 使 用 上 需 
几乎 无 处 不 在 ， 所 以 由 开发 者 来 部 署 GitLab 更 为 合适 。 本 节 重 点 讲解 GitLab 在 使 


者 少 走 弯路 。 


Ubuntu 内 置 的 apt 包 管理 器 来 安装 GitLab， 安 装 完成 后 再 进行 汉化 操作 。 


体 的 安装 步骤 在 这 里 不 再 歼 述 。 


要 使 


者 有 一 定 的 开发 经 验 ， 


网 


因为 其 中 对 于 


sudo apt-get install curl openssh-server ca-certificates postfix 


执行 过 程 中 ， 会 提示 选择 邮件 的 配置 ， 默 认 选 择 Internet Site， 按 回 车 键 即 可 ， 如 图 4-27 所 示 。 


MINGW64:/d/ubuntutp 


Package configuration 


Postfix Configuration 
Please select the mail server configuration type that best meets your needs. 


No configuration: 

Should be chosen to leave the current configuration unchanged. 

Internet site: 

Mail is sent and received directly using SMITP. 

Internet with smarthost: 

Mail is received directly using SMTP or by running a utility such 

as fetchmail. Outgoing mail is sent using a smarthost. 
Satellite system: 

All mail is sent to another machine, called a 'smarthost', for delivery. 
Local only: 

The only delivered mail is the mail for local users. There is no network. 


General type of mail configuration: 


No configuration 
Internet Site 

Internet with smarthost 
Satellite system 

Local only 


<Cancel> 


图 4-27 安装 依赖 时 选择 邮件 的 配置 


(3) 修改 apt 包 安装 工具 的 源 


为 了 快速 安装 ， 这 里 使 用 清华 大 学 开源 软件 站 的 Gitlab Community Edition 镜 像 进行 安装 。 首 先 执 行 以 下 命令 信任 GitLab 的 GPG 公 钥 : 


curl https://packages.gitlab.com/gpg.key 2> /dev/null | sudo apt-key add- &>/dev/null 


随后 执行 以 下 命令 : 


sudo vim /etc/apt/sources.list.d/gitlab-ce.list 


在 文件 中 增加 以 下 内 容 : 


deb https://mirrors.tuna.tsinghua.edu.cn/gitlab-ce/ubuntu xenial main 


人 提示: GnuPG (简称 GPG) 是 一 种 可 以 加 密 、 签 名 数据 和 信息 传递 的 技术 ， 包 含 一 个 通用 的 密 铀 管理 系统 ， 其 访问 模块 可 以 访问 各 种 公 铀 目录 。 


(4) 安装 GitLab 社 区 版 


GitLab 虽 然 开 源 免费 ， 但 是 也 分 为 社区 版 和 企业 版 ， 企 业 版 需要 订阅 收费 ， 不 过 一 般 团队 使 用 社区 版 就 可 以 完全 满足 团队 的 需求 。 


更 新 了 apt 的 源 信息 后 ， 需 要 先 执行 更 新 操作 : 


sudo apt-get update 


随后 执行 以 下 命令 安装 GitLab: 


sudo apt-get install gitlab-ce 
人 提示: 因为 GitLab 安 装 包 程序 大 概 有 几 百 光 ， 比 一 般 的 软件 都 要 大 ， 故 网 速 慢 ， 有 可 能 导致 安装 缓慢 。 
(5) 配置 GitLab 社 区 版 


安装 完毕 后 程序 会 自动 启动 服务 ， 此 时 需要 执行 首次 初始 化 : 


sudo gitlab-ctl reconfigure 


(6) 验证 GitLab 是 否 安装 成 功 


执行 以 下 命令 : 


sudo gjit1lab-ct1 status 


若 结果 跟 下 面 展示 的 类 似 ， 则 说 明 GitLab 已 经 安装 成 功 : 


run: gitaly: (pid 9374) 1530s; run: log: (Pid 1245) 4505s 
run: gitlab-monitor: (pid 9387) 1529s; run: log: (pid 1240) 4505s 


run: gitlab-workhorse: (pid 9390) 1529s; run: log: (pid 1238) 4505s 
run: logrotate: (pid 9400) 1528s; run: log: (pid 1237) 4505s 

run: nginx: (pid 9406) 1528s; run: log: (pid 1253) 4505s 

run: node-exporter: (pid 9449) 1528s; run: log: (pid 1246) 4505s 
run: postgres-exporter: (pid 9456) 1527s; run: log: (pid 1241) 4505s 
run: postgresql: (pid 9462) 1527s; run: log: (pid 1252) 4505s 

run: prometheus: (pid 9470) 1526s; run: log: (pid 1239) 4505s 

run: redis: (pid 9480) 1526s; run: log: (pid 1250) 4505s 

run: redis-exporter: (pid 9484) 1525s; run: log: (pid 1258) 4505s 
run: sidekiq: (pid 9490) 1525s; run: log: (pid 1254) 4505s 

run: unicorn: (pid 9497) 1525s; run: log: (pid 1236) 4505s 


(7) 初始 化 管理 员 密 码 并 登录 


GitLab 默 认 的 超级 管理 员 账号 为 root， 首 次 登录 需要 设置 密码 ， 设 置 完成 后 ， 就 可 以 登录 系统 进行 相关 的 操作 了 。 在 浏览 器 中 访问 地 址 http://192.168.33.33 后 ， 就 可 以 看 到 GitLab 的 首页 ， 第 一 次 登录 
系统 会 自动 提示 修改 root 账 号 的 密码 ， 如 图 4-28 所 示 。 


Please create a password for your new account. 


GitLab Community Edition Change your password 


Open source software to collaborate on code | New password 


Manage git repositories with fine grained access controls that keep Confirm new password 
your code secure. Perform code reviews and enhance collaboration 


with merge requests. Each project can also have an issue tracker and Change your password 


a wiki. 
Didn't receive confirmation instructions? 


Already have login and password? Sign in 


图 4-28 ”安装 GitLab 完 成 后 访问 首页 


2.GitLab 汉 化 


安装 成 功 后 ，GitLab 默 认 显示 语言 为 英文 ， 虽 然 使 用 上 没有 问题 ， 但 中 文 可 以 提升 用 户 使 用 的 体验 ， 这 里 建议 汉化 。 汉 化 的 步骤 如 下 。 


(1) 查看 GitLab 当 前 版 本 号 ， 执 行 以 下 命 


sudo cat /opt/gitlab/embedded/service/gitlab-rails/VERSION 


执行 完毕 后 ， 可 以 看 出 当前 版 本 号 为 9.5.4。 
(2) 克隆 汉化 代码 的 版 本 库 ， 导 出 对 比 文件 。 


在 任意 目录 下 ， 克 隆 汉 化 代码 的 版 本 库 ， 命 令 如 下 : 


git clone https://gitlab.com/xhang/gitlab.git 


进入 版 本 库 ， 比 较 汉化 标签 和 原 标签 ， 导 出 patch 命 令 用 的 diff 文 件 ， 命 令 如 下 : 


git diff v9.5.4 v9.5.4-zh > http://www.hzcourse.com/resource/readBook?path=/openresources/teach ebook/uncompressed/17746/0EBPS/Text/../9.5.4-zh.diff 


人 A 提示 : git diff 命 令 中 的 版 本 号 ， 需 要 和 用 户 本 地 安装 的 GitLab 工 具 的 版 本 号 保持 一 致 。 
(3) 导入 汉化 补丁 。 


导入 前 需要 先 停止 GitLab 的 服务 ， 执 行 以 下 命令 : 


sudo gitlab-ctl stop 


进入 到 补丁 所 在 的 目录 后 ,执行 patch 命 令 导入 : 


sudo patch -d /opt/gitlab/embedded/service/gitlab-rails -pl < 9.5.5-zh.diff 


执行 完毕 后 ， 再 次 启动 GitLab 服 务 : 


sudo gitlab-ctl start 


再 次 执行 初始 化 配置 命令 : 


sudo gitlab-ctl reconfigure 


完成 后 ， 在 浏览 器 中 访问 地 址 : http://192.168.33.33， 可 以 看 到 GitLab 已 经 汉化 成 功 ， 如 图 4-29 所 示 。 


GitLab 社区 版 登录 


注册 
用 于 代码 协作 的 开源 软件 用 户 名 或 邮 箱 
粒度 访问 控制 管理 g 以 保证 代码 安全 。 使 并 请 求 进行 代码 审查 root 
并 加 团体 合作 。 每 个 项 有 自己 的 问题 跟踪 和 维基 页 而 
空 三 
记 任 我 5 


没有 和 到 脆 认 邮件 7 重 白 发 送 确 认 帮 件 ， 


刘 览 。 帮助 ”关于 Gitlab 中 文 社区 版 


图 4-29 ”汉化 后 的 GitLab 易 用 性 显著 提高 


有 提示 : GitLab 版 本 迭代 较 快 ， 开 源 社区 对 它 的 汉化 工作 并 没有 完全 同步 更 新 ， 有 些 新 功能 和 结构 变更 可 能 没有 汉化 彻底 。 


4.4.2 了 解 GitLab 的 工作 流 


在 团队 协作 时 ， 必 须 有 一 个 相对 固定 和 规范 的 工作 方法 ， 这 样 团 


队 成 员 才能 有 序 、 高 效 地 工作 ， 项 目 也 可 以 井井有条 地 进行 下 去 ， 而 这 个 规范 的 工作 方法 ， 就 是 常 说 的 工作 流 。 


因为 GitLab 本 身 是 以 Git 作 为 版 本 管理 工具 ， 所 以 GitLab 工 作 流 本 身 结 合 了 Git 工 作 流 和 GitHub 工 作 流 的 特性 。 为 此 ， 我 们 先 了 解 下 什么 是 Git 工 作 流 和 GitHub 工 作 流 。 
1.Git 工 作 流 


为 了 方便 理解 ， 我 们 回顾 在 3.4 节 中 讲 过 的 实例 : 开发 者 需要 开发 一 个 新 功能 ， 而 在 master 分 支 上 新 建 了 dev 分 支 (新 功能 测试 和 开发 分 支 ) ， 在 新 功能 完成 需要 上 线 前 ， 把 deve 分 支 合并 回 master 分 
支 上 。 


这 其 实 就 描绘 了 简单 的 Git 工 作 流 的 基本 特性 : 


“ 至少 有 master 和 dev 分 支 。mastet 分 支 对 外 进行 版 本 发 布 ， 任 何 时 候 都 是 一 个 稳定 的 版 本 。dev 分 支 是 开发 分 支 ， 开 发 者 所 有 的 新 功能 都 会 提交 到 此 分 支 上 ， 版 本 发 布 时 ，dev 分 支 会 被 合并 到 master 分 
支 ， 项 目 需要 长 期 维护 两 个 分 支 。 


“ 新 的 功能 或 者 bug， 会 有 独立 的 分 支 进行 开发 ， 完 成 后 合并 到 master 或 者 dev 分 支 上 。 


在 Git 工 作 流 中 ， 虽 然 每 个 分 支 都 各 司 其 职 ， 但 是 分 支 过 多 也 提高 了 项 目 开 发 的 复杂 度 。 


2.GitHub 工 作 流 


在 GitHub 定 义 的 工作 流 规范 中 ， 只 有 master 分 支 ， 不 区 分 新 功能 分 支 或 修复 分 支 ， 其 他 分 支 在 需要 合并 时 ， 开 发 者 需要 提交 一 个 名 为 pull_request 的 推送 请 求 ， 该 推送 请 求 其 他 开发 者 都 可 以 看 到 ， 随 
后 会 对 推送 分 支 的 功能 和 代码 一 起 评审 。 当 提交 的 推送 请 求 被 接受 后 ， 分 支 会 被 合并 到 master 分 支 上 ， 原 分 支 会 被 删除 。 


GitHub 工 作 流 如 图 4-30 所 示 。 


推送 请 求 


创建 分 文 


图 4-30 ”GitHub 工 作 流 示意 图 


GitHub 工 作 流 有 以 下 几 个 特点 : 


“ 只 有 一 个 master 分 支 ， 关 联 自动 化 的 版 本 发 布 和 在 线 部 署 。 

“ 开发 人 员 合 并 分 支 到 mastet 之 前 需要 发 起 pull_request 推 送 请 求 。 

“ 其 他 开发 者 对 推送 请 求 进行 审核 。 

“ 推送 请 求 一 旦 通过 ， 会 立即 合并 到 master 分 支 上 ， 并 马上 部 署 到 线 上 。 


在 这 样 的 规范 下 ， 不 需要 维护 很 多 各 式 各 样 的 分 支 ， 相 比 Git 工 作 流 ， 在 操作 和 管理 上 更 加 简单 。 但 问题 在 于 ， 因 为 只 有 一 个 master 分 支 ， 不 足以 满足 所 有 的 需求 ， 当 不 能 同步 到 线 上 时 ， 则 需要 新 建 分 
支 专门 管理 。 


3.GitLab 工 作 流 
GitLab 工 作 流 在 实现 时 ， 结 合 了 Git 与 GitHub 的 优点 ， 只 设立 一 个 master 分 支 ， 但 是 所 有 的 其 他 分 支 的 代码 变动 ， 都 需要 与 master 分 支 保持 同步 。 


例如 ， 为 了 发 布 版 本 ， 在 master 分 支 上 创建 develop 分 支 ， 用 来 进行 代码 上 线 前 的 测试 与 预览 ， 再 从 develop 分 支 上 创建 product 分 支 ， 对 应 上 线 版 本 。 此 时 若 出 现 bug 问 题 需要 修改 ， 则 需要 先 在 
master 分 支 上 修复 ， 再 向 develop 分 支 上 合并 ， 测 试 没 问题 后 ， 再 合并 到 product 分 支 正 式 上 线 ， 这 样 可 以 保证 每 个 分 支 的 代码 都 已 经 修复 了 这 个 问题 。 


新 功能 的 开发 与 提交 ， 也 与 修改 bug 类 似 ， 自 上 而 下 从 master 分 支 向 下 合并 ， 如 图 4-31 所 示 。 


主干 分 文 ”测试 分 文 ”生产 分 文 


图 4-31 ”GitLab 工 作 流 示意 图 


其 次 ，GitLab 中 对 于 代码 的 提交 存在 Merge Request 概 念 ， 即 合并 请 求 ， 这 和 GitLab 上 的 推送 请 求 类 似 ， 开 发 者 在 分 支 上 的 一 次 或 者 多 次 的 提交 ， 可 以 合并 为 一 个 合并 请 求 发 送出 去 ， 当 具有 相应 权限 
的 开发 者 审核 通过 后 ， 才 可 以 合并 到 指定 的 分 支 上 ， 若 代码 不 符合 要 求 ， 还 可 以 取消 当 次 的 合并 请 求 。 


最 后 ， 结 合 GitLab 中 对 于 用 户 的 


色 设 定 ， 来 看 一 个 完整 的 GitLab 工 作 流 是 什么 样 的 。GitLab 代 码 开 发 工作 流 如 图 4-32 所 示 。 


项 目 管理 员 


创建 群 组 《Group) 在 master 上 创建 开发 分 支 


所 开发 i 
开发 人 员 (Developor) 版 本 提交 


提交 合并 请 求 
(MergeRe quest) 


版 本 提交 并 将 问 
题 标记 为 已 解决 


代码 上 线 到 生产 环境 


图 4-32 ”GitLab 代 码 开 发 工作 流 完整 视图 


4.4.3 ”GitLab 用 户 和 项 目 管理 


本 节 根 据 实 际 工作 需求 ， 将 讲解 核心 的 GitLab 管 理 操作 ， 其 中 不 仅 包含 群 组 与 项 目的 创建 ， 还 有 人 员 和 角色 的 分 配 与 管理 。 学 完 本 节 内 容 后 ， 开 发 者 可 以 更 好 地 在 项 目 开发 中 实践 GitLab 工 作 流 。 


1. 创 建 用 户 


(1) 创建 管理 员 用 户 


在 GitLab 中 ， 开 发 者 可 以 自行 注册 账号 ， 也 可 以 让 管理 员 在 后 台 进 行 创建 。 每 个 GitLab 都 会 有 一 个 超级 管理 员 账号 (如 本 实例 中 的 root 账 号 ) ， 可 以 创建 不 同 角色 的 用 户 账号 。GitLab 功 能 庞大 ， 为 了 
更 加 方便 地 定位 到 操作 功能 界面 ， 在 非 必要 的 情况 下 ， 书 中 实例 将 会 统一 使 用 URL 地 址 进行 访问 。 


使 用 root 账 号 登录 GitLab 后 ， 创 建 一 个 管理 员 级 别 的 账号 ， 访 问 地 址 http://192.168.0.238/admin/users/new， 填 写 基本 信息 后 ， 完 成 账号 的 创建 。 需 要 注意 的 是 ， 除 了 系统 提示 必 填 的 用 户 名 等 ， 选 
择 用 户 权限 为 管理 员 ， 如 图 4-33 所 示 。 


权限 级 别 “ 普 通用 广 
普通 用 户 可 以 访问 他 们 的 群 组 和 项 目 
图 管理 员 

管理 员 可 以 访问 所 有 组 ， 项 目 和 用 户 ， 并 且 可 以 管理 此 安装 中 的 所 有 功能 


图 4-33 ”选择 权限 级 别 为 管理 员 


账号 名 等 信息 可 以 根据 需求 填写 ， 本 实例 账号 名 为 : wangjialinadmin。 


全 提示 : 访问 地 址 中 的 IP 需 要 换 成 实际 的 GitLab 服 务 地 址 。 


(2) 创建 普通 用 户 


为 了 方便 演示 ， 在 GitLab 注 册 界面 ， 手 动 注册 两 个 普通 用 户 。 注 册 完 毕 后 ， 使 用 管理 员 账 号 (wangjialinadmin) 登录 ， 然 后 查看 用 户 列表 ， 如 图 4-34 所 示 。 


李 轰 化 


licuihua@gitlab.com 


Dg 
wangdali@gitlab.com 


图 4-34 查看 新 注册 的 普通 用 户 
2. 创 建 群 组 和 项 目 


在 实际 的 项 目 中 ， 如 果 遇 到 开发 者 需要 同时 开发 、 维 护 多 个 项 目 时 ， 则 需要 先 创建 群 组 ， 群 组 实际 上 就 是 多 个 项 目的 集合 。 创 建 群 组 ， 对 开发 者 而 言 ， 能 更 加 方便 地 访问 项 目 ， 对 于 管理 者 而 言 ， 简 化 
了 多 个 项 目的 权限 、 操 作 管理 。 


群 组 和 项 目的 关系 密 不 可 分 ， 一 般 来 说 ， 开 发 者 会 根据 实际 需求 创建 对 应 权限 的 群 组 ， 随 后 再 添加 项 目 。 具 体 步骤 如 下 。 


(1) 创建 群 组 


使 用 管理 员 账号 (wangjialinadmin) 登录 后 ,访问 以 下 地 址 http://192.168.0.238/groups/new， 创 建新 群 组， 为 了 体现 角色 权限 的 用 处 ， 选 择 可 见 等 级 为 Private (私有 ) ， 当 需要 时 才 把 用 户 添加 
到 当前 群 组 。 群 组 创建 界面 ， 如 图 4-35 所 示 。 


新 群 组 


群 组 路 径 http://192.168.0.238/ mobile-game 


群 组 名 称 mobile-game 


描述 移动 游戏 开发 事业 部 


群 组 图 标 S 选择 文件 .文件 名 .… 
允许 的 最 大 文件 大 小 200KB。 


可 见 等 级 @ © @ private 
该 群 组 和 其 项 目 只 有 其 成 员 能 以 看 到 。 


4-35 创建 新 的 群 组 


(2) 添加 成 员 


完成 以 上 步骤 后 ， 系 统 会 自动 重 定向 到 群 组 管理 界面 ， 此 时 ， 可 以 把 此 前 创建 的 两 个 用 户 添加 到 群 组 中 去 。 在 成 员 列 表 上 ， 可 以 对 用 户 进行 权限 的 分 配 ， 这 两 个 用 户 都 设置 为 “开发 人 员 ” 的 权限 ， 如 
4-36 所 示 。 


mobile-game Users were successfully added. 


合 概览 成 员 
D) 问题 0 
和 合并 请 求 部 添加 成 员 到 mobile-game 
加 王 大 力 x ” 李 丙 花 x 开发 人 员 $ 访问 到 期 日 期 添加 到 群 组 
成 员 

搜索 已 存在 的 成 员 或 者 使 用 他 们 的 邮箱 地 址 邀请 。 点 击 这 里 了 解 更 多 关于 角色 到 此 日 期 ， 该 成 员 将 自动 失去 

妆 设置 权限 的 介绍 。 对 此 群 组 及 其 所 有 项 目的 访问 
权限 。 
群 组 成 员 通过 名 宇 查找 已 存在 的 成 员 名 称 , 升序 


有 权 访问 mobile-game 的 成 员 和 


策 李 翠 花 @licuihua 开发 人 员 到 期 日 期 加 


加 入 时 间 less than a minute ago 


/、 王 大 力 @wangdali 
振 : 加 入 时 间 less than a minute ago 开发 人 员 到 期 日 期 回 


王 甲 临 -普通 管理 员 @wangjialinadmin 国 
加 入 时 间 2 minutes ago 


图 4-36 ”给 群 组 添加 开发 人 员 角 色 用 户 


人 提示: GitLab 在 添加 成 员 时 ， 根 据 用 户 输入 的 关键 字 可 以 自动 检索 对 应 的 用 户 ， 十 分 方便 。 


(3) 创建 项 目 


在 GitLab 顶 部 导航 上 单 击 “+” 号 ， 就 会 出 现 创建 项 目 菜单 ， 随 后 选择 “新 建 项 目 ”命令 为 当前 群 组 创建 项 目 ， 如 图 4-37 所 示 。 


当前 群 组 ”搜索 Q £9+v0D 包 


This group 
新 建 项 目 
新 建 子 群 组 
GitLab 
新 建 项 目 

新 建 群 组 

新 建 代 码 片 段 


项 目 路 径 项 目 名 称 
http://192.168.0.238/ mobile-game game-server 


希望 将 几 个 相关 联 的 项 目 放 置 于 同一 个 命名 空间 下 ? 创建 群 组 
项 目 描述 (可 选 ) 
游戏 服务 器 项 目 


可 见 等 级 @ 


9 @ Private 
Project access must be granted explicitly to each user. 


图 4-37 在 群 组 中 创建 项 目 
人 提示 : 项 目的 创建 与 群 组 没有 必然 关系 ， 完 全 可 以 创建 独立 的 项 目 进行 管理 。 


3. 项 目 管理 


项 目 创建 完毕 后 ， 系 统 会 自动 重 定向 到 项 目的 主 界面 ， 在 这 里 可 以 对 项 目 进行 各 种 操作 。 在 项 目 管理 界面 的 左 人 出， 可 以 看 到 其 功能 菜单 ， 包 含 以 下 核心 功能 : 


“ 概览， 在 这 里 可 以 看 到 项 目 代码 仓库 的 地 址 以 及 一 些 项 目的 基本 信息 。 
“ 版 本 库 ， 包 含 完整 的 Git 操 作 ， 如 文件 查看 、 提 交 记 录 和 合并 操作 等 。 
“ 问题 ， 项 目 版 本 问题 管理 功能 。 

“ 合并 请 求 ， 可 以 处 理 开 发 者 提交 的 合并 请 求 。 


“ CI/CD， 持 续集 成 、 交 付 和 部 署 管 理 ， 自 动 化 构建 管理 代码 的 提交 、 测 试 和 构建 。 


在 这 里 重点 看 下 问题 管理 功能 和 合并 请 求 这 两 个 功能 模块 的 使 用 。 


(1) 问题 管理 功能 


项 目 开 发 难免 出 现 问题 (bug) ， 测 试 人 员 完 全 可 以 使 用 GitLab 自 带 的 问题 模块 ， 来 实现 缺陷 管理 。 在 GitLab 的 项 目 中 提交 问题 的 一 般 流 程 如 图 4-38 所 示 。 


结束 


图 4-38 在 GitLab 的 项 目 中 提交 问题 的 流程 


比如 举 个 例子 : 马上 要 到 十 一 假期 了 ， 工 程 师 王 大 力 的 在 线 商城 的 支付 模块 出 了 问题 (无 法 完成 支付 ) ， 若 商家 在 搞活 动 时 发 现 用户 无 法 支付 ， 后 果 不 堪 设 想 ， 这 时 候 测试 人 员 就 要 提交 问题 了 ， 提 交 
的 问题 需要 满足 以 下 条 件 : 


“ 需要 解决 问题 的 优先 级 为 最 高 。 
“十 月 一 日 前 务必 要 解决 问题 。 
“ 指派 问题 给 开发 人 员 王 大 力 。 


这 样 新 建 一 个 问题 ， 就 需要 设置 指派 人 员 、 截 止 日 期 和 问题 的 优先 级 这 几 个 必 选 项 ， 如 图 4-39 所 示 。 


新 建 问题 
标题 在 线 商城 下 单 后 无 法 支付 
增加 描述 模板 以 帮助 您 的 贡献 者 们 更 有 效 地 沟通 ! 
描述 编写 预览 
如 题 
Markdown 及 quick actions 格式 
局 此 问题 是 保密 的 ， 只 对 团队 成 员 可 见 
指派 王 大 力 指派 给 自己 截止 日 期 2017-09-30 
里 程 碑 里 程 碑 
标记 BUG +1 more 


四 添加 附件 


图 4-39 ”在 GitLab 中 新 建 问题 


在 编辑 问题 时 ， 除 了 可 以 方便 地 指派 人 员 和 时 间 等 ， 问 题 的 描述 可 以 使 
增加 多 个 标记 ， 每 个 标记 还 可 以 设置 不 同 的 优先 级 ， 以 便 区 分 每 个 问题 的 状态 。 进 入 标记 管理 后 ， 列 表 如 图 4-40 所 示 。 


Markdown 文 本 格式 编写 ， 问 题 图 片 也 可 以 直接 拖 搜 到 富 文本 编辑 框 中 进行 上 传 ， 文 本 格式 可 以 进行 预览 。 


同时 一 个 问题 可 以 


GitLab 
标记 


mobile-game ) R runner-test v 


标记 可 应 用 于 问题 和 合并 请 求 。 为 标签 加 注 星 标 ， 使 其 成 为 优先 标记 。 通过 拖 动 来 排列 优先 标记 以 更 改 其 相对 优先 级 。 


New label 


优先 标记 
* © Project Label 查看 合并 请 求 ”查看 未 关闭 问题 订阅 了 区 全 
其 它 标记 
nn Es Project Label 查看 合并 请 求 ”查看 未 关闭 问题 订阅 人 区 全 
4-40 ”管理 标记 的 优先 级 
新 建 问题 完毕 后 ， 在 问题 列表 中 不 仅 可 以 看 到 详细 的 信息 ， 还 可 以 追加 评论 ， 评 论 时 可 以 “@” 某 个 开发 者 ,方便 其 了 解 最 新 的 动态 ， 如 图 4-41 所 示 。 
(2) 开发 者 提交 合并 请 求 
在 GitLab 工 作 流 中 ， 合 并 请 求 是 不 可 缺少 的 一 步 ， 在 实际 的 团队 管理 中 ， 应 当 设 置 专 门 的 管理 员 角 色 ， 对 开发 者 提交 的 合并 请 求 代码 进行 审核 管理 。 
这 里 还 是 以 王 大 力 的 在 线 商城 无 法 支付 的 问题 为 例 ， 来 看 一 下 合并 请 求 模块 的 使 用 。 
首先 使 用 王 大 力 的 账号 登录 GitLab， 在 项 目的 问题 列表 中 找到 此 问题 ， 在 详情 页 中 ， 可 以 创建 一 个 名 为 问题 ID 的 修复 分 支 ， 操 作 结果 如 图 4-42 所 示 。 
% 
人 
在 线 商城 下 单 后 无 法 支付 
如 题 
0 0 创建 合并 请 求 | ~ 
王 甲 临 -普通 管理 员 @wangjialinadmin commented less than a minute ago 所 有 者 
目前 测试 环境 测试 可 以 支付 
王 甲 临 -普通 管理 员 @wangjialinadmin commented less than a minute ago 所 有 者 
@wangdali 重点 排查 正式 环境 


4-41 在 问题 下 进行 评论 操作 


Create a branch 


创建 合并 请 求 
创建 一 个 以 此 问题 命名 的 合并 请 求 ， 源 分 支 


为 'master' 。 


Create a branch 


创建 一 个 以 此 问题 命名 的 分 支 ， 源 分 支 为 


‘master' 。 


4-42 在 问题 下 创建 一 个 修复 分 支 


创建 成 功 后 ， 进 入 到 此 修复 分 支 ， 为 了 模拟 合并 请 求 ， 这 里 新 增 一 个 PHP 脚 本 文件 pay.php， 内 容 如 下 : 


<?php 
header ('Content-type:text/html;charset=utf-8'); 
echo "问题 修复 时 间 :".date ('Y-m-d H:i:s'); 


提交 以 后 ， 效 果 如 图 4-43 所 示 。 


GitLab mobile-game / R runner-test v 
Repository 


文件 已 创建 成 功 。 


您 推送 了 1- about a minute ago Create merge request 


1- runner-test / pay.php Q Findfile Blame History Permalink 


增加 问题 修复 文件 pay.php @ ec7el4e8 B® 


王 大 力 committed about a minute ago 


国 pay.php 101Bytes 区 加 四 ”编辑 替换 


<?php 
2 header('Content-type:text/html;charset=utf-8'); 
echo “问题 修复 时 间 :" .date('Y-m-d H:i:s'); 


4-43 在 问题 分 支 上 修复 问题 


当 开 发 者 确认 问题 已 经 修复 完成 (本 地 测试 ) 后 ， 就 可 以 提交 合并 请 求 了 ， 单 击 Create merge request 按 钮 ， 进 入 到 合并 确认 页 面 。 一 般 来 说 ， 这 里 只 需要 指定 审核 人 员 后 提交 即 可 ， 另 外 可 以 勾 选 接 
收 请 求 后 删除 来 源 分 支 ， 以 减少 版 本 库 中 无 用 分 支 的 数量 ， 如 图 4-44 所 示 。 


新 建 合并 请 求 
从 1- 合并 到 master 


标题 增加 问题 修复 文件 pay.php 
标题 以 WIP: 开头 将 合并 请 求 标识 为 正在 处 理 中 表示 其 还 未 准备 好 可 以 接受 合并 。 
增加 描述 模板 以 帮助 您 的 贡献 者 们 更 有 效 地 沟通 ! 


描述 编写 ”预览 


LLOSeS #1 


BT 男 收 汉江 区 2 


图 4-44 ”开发 者 提交 合并 请 求 


(3) 管理 者 审核 合并 请 求 


此 时 工程 师 王 大 力 的 第 一 步 工作 已 经 完成 ， 使 用 管理 员 账 号 登录 后 ， 查 看 其 提交 的 合并 请 求 ， 详 情 页 如 图 4-45 所 示 。 


GitLab mobile-game / R runner-test v 


合并 请 求 


合并 请 求 1 在 4 minutes ago 由 王 甲 临 -普通 管理 员 


增加 问题 修复 文件 pay.php 


Closes #1 


Request to merge 1- 加 into master 


©) Pipeline #9 (w) passed for ec7e14e8. 


© | Merge | 日 Remove source branch Modify commit message 


Closes #1 


You can merge this merge request manually using the command line 


编辑 关闭 合并 请 求 


Check out branch 业 ~ 


4-45 查看 开发 者 提交 的 合并 请 求 


同时 可 以 方便 地 在 下 方 看 到 提交 记录 和 变更 后 对 比 的 详细 修改 ， 如 图 4-46 所 示 。 


讨论 0 提交 1 流水 线 1 变更 1 


29 Sep, 2017 1 commit 


者; 增加 问题 修复 文件 pay.php 
~ 王 大 力 committed 33 minutes ago 


OO ec7el14e8 BH 


图 4-46 ”查看 合并 请 求 的 提交 记录 1 


讨论 0 提交 1 流水 线 1 变更 1 


版 本 比较 ”最 新 版 本 ~ 和 master 


正在 显示 1 个 修改 的 文件 包含 4 行 增加 和 0 行 删除 


v 国 pay.php 0>100644 ”加 


1 +<?php 
2 +header('Content-type:text/html;charset=utf-8'); 
3 + echo “问题 修复 时 间 :".date('Y-m-d H:i:s');} 


at 


隐藏 空白 字符 变更 。 内 嵌 并排 


多 编辑 查看 文件 @ ec7el4e8 


随后 需要 把 当前 分 支 检 出 到 本 地 ， 审 查 没 问题 后 ， 再 决定 是 否 执行 合并 操作 ， 


检 出 ， 在 本 地 审查 和 合并 


Step 1. 获取 并 检 出 此 合并 请 求 的 分 支 


git fetch origin 
git checkout =b 1- origin/1- 


Step 2. 本 地 审查 变更 
Step 3. 合并 分 支 并 修复 出 现 的 任何 冲突 


git checkout master 
git merge 一 no=ff 1- 


Step 4. 推送 合并 的 结果 到 GitLab 


git push origin master 


图 4-46 ”查看 合并 请 求 的 提交 记录 2 


操作 流程 如 图 4-47 所 示 。 


提示 : 您 可 以 参考 这 个 说 明 将 合并 请 求 检 出 到 本 地 。 


图 4-47 ” 检 出 分 支 并 在 本 地 审查 和 合并 


确保 无 误 后 ， 单 击 Merge 按 钮 ， 分 支 就 被 合并 到 master 主 干 分 支 了 ， 结 果 如 


图 4-48 所 示 。 


(v) Merged by 王 甲 临 -普通 管理 员 less than a minute ago | Revert Cherry-pick 


The changes were merged into 


master 


The source branch has been removed 


Closed #1 (closed) 


图 4-48 ”成 功 合并 代码 并 删除 源 分 支 


以 上 就 是 管理 员 执行 合并 请 求 的 全 部 流程 ， 若 代码 审核 不 通过 ， 可 以 关闭 合并 请 求 ， 并 告知 开发 者 关闭 的 理由 ， 开 发 者 根据 反馈 的 意见 进行 新 的 修改 、 提 交流 程 即 可 。 


全 提示 : 本 实例 中 的 演示 ， 都 是 在 线 进行 的 Git 相 关 操 作 ， 如 代码 提交 等 ， 而 在 本 地 创建 副本 的 过 程 跟 一 般 的 Git 操 作 完 全 一 致 。 


4.4.4 ”GitLab 持 续集 成 与 自动 构建 实践 


当 团队 人 数 众多 ， 每 天 都 有 大 量 的 合并 请 求 检查 时 ， 管 理 员 难 免 会 忙 不 过 来 。 


统 使 用 的 效率 。 


1. 持 续集 成 、 持 续 交付 和 持续 部 署 原理 


在 使 用 GitLab 进 行 项 目 管理 时 ， 发 现在 项 目 管理 菜单 中 有 一 个 CI/CD 的 功能 。 


试 


例 的 失败 ， 都 会 导致 不 能 集成 。 


使 用 持续 集成 的 优点 主要 有 以 下 两 个 : 


“ 快速 发 现 问题 ， 减 少 人 工 审核 的 成 本 。 


“ 防止 本 地 分 支 代码 大 幅度 偏离 主干 代码 。 


还 有 另外 两 个 概念 与 持续 集成 紧密 相关 ， 分 别 是 持续 交付 和 持续 部 署 。 其 实 持续 交付 指 的 是 可 以 自动 的 、 频 繁 地 把 项 目 自动 交付 给 客户 或 者 质量 团 
， 任 何 的 测试 、 评 审 过 程 都 是 完全 自动 的 。 


持续 部 署 又 可 以 看 成 是 持续 交付 的 下 一 步 ， 当 交付 的 内 容 通 过 评审 后 ， 会 自动 部 署 到 生产 环境 中 。 这 里 简单 列 出 一 个 从 代码 提交 到 上 线 部 署 的 流程 ， 完 全 实现 了 持续 集成 、 交 付 与 部 署 ， 如 图 


此 时 就 需要 一 些 自动 化 的 脚本 程序 ， 在 代码 提交 时 ， 进 行 一 些 检查 和 操作 ， 这 样 就 可 以 省 去 大 量 的 人 工 审核 时 间 ， 提 高 系 


简单 来 说 ， 持 续集 成 指 的 就 是 频繁 地 将 代码 提交 集成 到 主干 上 ， 但 是 在 每 次 集成 之 前 ， 都 需要 通过 自动 化 的 测试 ， 任 何 测 


队 ， 可 以 看 成 是 持续 集成 的 下 一 步 ， 在 交付 的 过 程 


4-49 所 


集成 代码 到 主干 


GitLab 
代码 管理 


GitLab CI 
自动 集成 


GitLab CD 
自动 部 署 


测试 /正式 
服务 器 


图 4-49 ”GitLab 持 续集 成 、 交 付 和 部 署 流程 示意 图 


2.GitLab-Cl 与 GitLab-Runner 实 践 


在 GitLab 8.x 版 本 后 ， 系 统 已 经 集成 了 CI 组 件 ， 不 过 还 需要 在 服务 器 上 安装 GitLab-Runner， 以 实现 自动 构建 、 自 动 部 署 等 。 接 下 来 看 看 如 何 配置 持续 集成 。 


在 实际 使 用 中 ，GitLab-CI 的 作用 是 配置 需要 执行 的 自动 化 构建 任务 脚本 ， 当 每 次 开发 者 提交 代码 时 ，GitLab-Runner 会 自动 获取 GitLab-CI 预 定义 的 任务 内 容 ， 并 随后 运行 。Runner 服 务 可 以 搭建 在 当 
前 的 服务 器 上 ， 不 过 为 了 不 影响 GitLab 的 使 用 ， 建 议 搭建 在 独立 的 服务 器 上 运行 。 整 个 安装 流程 如 下 。 


(1) 搭建 Vagrant 虚 拟 机 


在 GitLab 虚 拟 机 外 ， 再 搭建 一 台 Ubuntu16.04 的 服务 器 ， 相 关 流 程 可 以 参考 之 前 的 教程 ， 操 作 过 程 不 再 赣 述 。 


(2) 使 用 apt 工 具 安装 GitLab-Runner 


连接 到 服务 器 后 ， 执 行 以 下 命令 ， 添 加 GitLab 相 关 的 源 : 


# For Debian/Ubuntu 
curl https://packages.gitlab.com/install/repositories/runner/gitlab-cimulti— 
runner/script.deb.sh | sudo bash 


随后 执行 如 下 安装 命令 : 


# For Debian/Ubuntu 
sudo apt-get install gitlab-ci-multi-runner 


命令 执行 完成 后 ， 安 装 完毕 。 
(3) 注册 GitLab-Runner 服 务 


为 了 方便 演示 ， 在 GitLab 上 新 增 一 个 项 目 名 runner-test。 在 项 目的 设置 中 ， 找 到 流水 线 界面 ， 可 以 找到 当前 项 目的 URL 和 TOKEN 两 个 参数 ， 等 会 注册 Runner 服 务 时 就 需要 这 两 个 参数 ， 以 便 进 行 数据 
验证 和 通信 使 用 。 其 位 置 所 在 ， 如 图 4-50 所 示 。 


特定 的 Runners 


How to setup a specific Runner for a new project 
1. Install a Runner compatible with GitLab CI (checkout the 

GitLab Runner section for information on how to install it). 
2. Specify the following URL during the Runner setup: 


http://192.168. 


B23687 


3. Use the following registration token during setup: 
J2mo2iurNpmWBzJxm6aE 
4. Start the Runner! 


连接 到 部 署 Runner 的 服务 器 ， 


执行 以 下 命令 开始 注册 : 


4-50 在 项 目 中 找到 URL 和 Token 


sudo gitlab-ci-multi-runner register 


随后 一 步 一 步 根据 提示 输入 内 容 ， 执 行 过 程 如 下 : 


Please enter the gitlab-ci coordinator URL (e.g. https://gitlab.com/): 


http://192.168.0.238/ 
Please enter the gitlab-ci 
J2mo2iurNpmWBzJxm6aE 
Please enter the gitlab-ci 


# 输入 GitLab 的 地 址 
token for this runner: 
# 输入 项 目的 Token 


description for this runner: 


[ubuntu-xenial] : runner-test # 输入 Runner 的 名 称 


Please enter the gitlab-ci 
runner-test 


tags for this runner (comma separated): 
# 输入 Runner 的 Tags， 可 以 用 逗号 分 隔 


Whether to run untagged builds [true/false] : 


[false] : true 


] 
# 是 否 允 许 未 标记 的 构建 ， 输 入 true 


Whether to lock Runner to current project [true/false]: 


[false]: true 


# Runner 是 否 只 能 用 于 当前 项 目 ， 输 入 true 


Registering runnerhttp://www.hzcourse.com/resource/readBook?path=/openresources/teach ebook/uncompressed/17746/0EBPS/Text/... succeeded runner=J2mo2iur 
Please enter the executor: ssh, virtualbox, dockertmachine, docker-ssht+ 
machine, docker, docker-ssh, shell, parallels, kubernetes: 


shell 


# 构建 执行 的 方式 ， 这 里 选择 命令 行 shell 


Runner registered successfully. Feel free to start it, but if it's running 
already the config should be automatically reloaded! 


执行 完成 后 ， 回 到 GitLab， 前 往 获取 URL 和 Token 的 页 面 ， 刷 新 后 会 出 现 Runner 的 信息 ， 走 到 这 一 步 时 ，Runner 的 安装 和 注册 就 完成 了 ， 如 图 4-51 所 示 。 


(4) 配置 .gitlab-ci.ym|I 文 件 


当前 项 目 有 效 可 用 的 runner 


@ f05f0a23@ 雹 


runner-test 


runner-test 


#2 


4-51 查看 当前 项 目的 Runner 


gitlab-ci.yml 是 配置 CI 在 项 


中 需要 做 哪些 操作 的 文件 ， 该 文件 位 于 仓库 的 根 


录 。 当 有 新 内 容 推送 到 仓库 后 ，GitLab 会 查找 是 否 有 .gitlab-ci.yml 文 件 ， 若 文件 存在 ，Runner 将 会 根据 该 文件 的 内 容 开 


始 自动 构建 本 次 的 提交 。.gitlab-ci.yml 文 件 存放 在 仓库 里 ， 所 以 这 个 文件 是 受 版 本 控制 的 。 


官方 给 出 的 .gitlab-ci.yml 格 式 如 下 所 示 : 


before script: 


- apt-get update -qq && apt-get install -y -qq sqlite3 libsqlite3-dev nodejs 


- ruby -v 

- which ruby 

- gem install bundler --no-ri --no-rdoc 

- bundle install --jobs $ (nproc) "“${FLAGS[@]}" 


rspec: 
script: 
- bundle exec rspec 


rubocop: 
script: 
- bundle exec rubocop 


这 段 配 置 代码 不 难 理解 ， 其 中 定义 了 两 个 任务 : rspec 和 rubocop， 而 在 这 两 个 任务 执行 前 ,会 先 执行 before_script 中 定义 的 内 容 。 


随后 在 runner-test 项 目 中， 添加 新 文件 ， 可 以 选择 模板 ， 依 次 选中 .gitlab-ci.yml 和 PHP。 系 统 会 自动 创建 一 个 .gitlab-ci.yml 模 板 文件 ， 如 图 4-52 所 示 。 


新 建文 件 模板 .gitlab-ciyml PHP 模板 已 应 用 ” 医 沁 二 


P master /  ,gitLab-ci,ymtL 


1 # This file is a template，and might need editing before it works on your project. 
2 # Select image from https://hub.docker.com/ /php/ 

3 image: php:7.1.1 

4 

5 # Select what we should cache between builds 

6 cache: 

gy paths: 

8 - vendor/ 

9 


16 before_script: 
11 - apt-get update -yqq 
12 - apt-get install -yqq git libmcrypt-dev libpq-dev libcurl4-gnutls-dev libicu-dev libvpx-dev libjpeg-dev libpng 


A427 Tat+all Mn 


图 4-52 ”创建 .gitlab-ci.yml 模 板 文 件 


不 过 Vagrant 虚 拟 机 上 目前 没有 安装 PHP 相 关 的 组 件 ， 所 以 对 文件 内 容 进行 简化 修改 如 下 : 


before, script: 


- echo "脚本 前 执行 了 一 个 文本 输出 " 


test: 
script: 网 
- echo "执行 了 一 个 任务 " 


提交 后 ，GitLab 会 自动 检测 配置 文件 是 否 正 确 ， 如 图 4-53 所 示 。 


文件 提交 


王 甲 临 -普通 管理 员 committed less than a minute ago 


w 这 个 GitLab Cl 配置 是 有 效 的 。 了 解 更 多 


图 4-53 ”通过 检测 的 GitLab CI 配置 文件 


(5) 查看 自动 构建 结果 


打开 项 目的 流水 线 模块 ， 看 到 两 次 提交 构建 记录 ， 其 中 第 一 次 构建 失败 了 ， 而 第 二 次 构建 成 功 。 在 流水 线 列表 里 面 ， 包 含 了 构建 的 提交 号 、 是 否 成 功 和 构建 执行 时 长 等 信息 ， 如 图 4-54 所 示 。 


GitLab mobile-game / R runner-test v 
流水 线 
All 2 Pending 0 Running 0 Finished 2 Branches Tags Run Pipeline Cl Lint 
Status Pipeline Commit Stages 
Dy q | #6 by P master -0- 2d5c0f01 一 加 00:00:01 
(v bd 
Bimini | latest | 更 新 .gitlab-ci.yml F 蝎 8 minutes ago 
1 P master -0- a2105a00 /~ 
failed #5 b (x 涪 10 minutes ago Cc 
[Lenedj] Y 文件 提交 YY 站 9 


4-54 查看 每 次 提交 后 自动 构建 的 信息 


单 击 列 表 上 stages 下 的 状态 按钮 ， 可 以 在 弹出 对 话 框 中 看 到 各 个 任务 的 执行 情况 ， 如 


4-55 所 示 。 


[ 


test - passed 


图 4-55 查看 自动 构建 任务 的 执行 状态 


单 击 test 任 务 按钮 后 ， 可 以 看 到 任务 执行 详细 信息 ， 如 图 4-56 所 示 。 


GitLab mobile-game R runner-test v 


作业 


) passed | Job #10 triggered 14 minutes ago by 王 甲 临 -普通 管理 员 Retry 


Running with gitlab-ci-multi-runner 9.5.0 (413da38) 
on runner-test (f05f0a23) 

Using Shell executor,... 

Running on ubuntu-xeniat., 

Fetching changes... 

HEAD is now at a2105a0 文件 提交 

From http://192.168.0.238/mobile-game/runner-test 
a2105a0, .2d5c0f0 master -> origin/master 

Checking out 2d5c8f01 as master... 

Skipping Git submodules setup 

$ echo“" 脚 本 前 执行 了 一 个 文本 输出 " 

脚本 前 执行 了 一 个 文本 输出 

$ echo "执行 了 一 个 任务 " 

执行 了 一 个 任务 

Job succeeded 


图 4-56 ”查看 自动 构建 的 结果 


(6) 更 复杂 的 集成 构建 任务 


在 上 面 中 的 实例 ， 只 是 执行 了 两 个 相对 简单 的 shell 命 令 ， 而 在 实际 项 目 中 构建 配置 却 要 复杂 得 多 。 以 PHP 项 目 为 例 ， 可 以 在 脚本 中 定义 不 同 的 任务 并 实现 以 下 功能 : 


“ 任务 执行 前 基础 组 件 的 检测 和 安装 。 如 Git、Composer 和 一 些 基础 的 扩展 都 可 以 在 任务 执行 前 进行 检测 ， 若 不 存在 可 以 执行 安装 或 更 新 操作 。 
: 单元 测试 。 编 写 PHP UNIT 相 关 的 任务 ， 执 行 相关 测试 。 


“项目 部 署 。 例如， 可 以 自 定义 相应 的 任务 ， 当 其 他 的 任务 检测 通过 后 ， 把 最 新 的 提交 部 署 到 测试 服务 器 上 。 


除了 以 上 操作 外 ， 如 果 配 置 的 灵活 性 很 好 ， 开 发 者 可 以 根据 需求 自行 搭配 。 


第 5 章 ” 好 用 的 PHP 开 发 环境 一 一 PHPStorm 


开发 者 在 编写 程序 时 ， 为 了 提升 编码 的 效率 ， 除 了 需要 符合 编程 语言 开发 的 规范 ， 还 需要 强大 的 编辑 器 工具 的 支持 。 本 章 除了 讲解 常见 的 编辑 器 工具 之 外 ， 还 会 重点 讲解 PHP 集 成 开发 环境 一 一 
PHPStorm 的 常见 技巧 与 进 阶 用 法 。 


5.1 ”常用 PHP 源 代码 开发 工具 


本 节 重 点 讲解 PHP 开 发 过 程 中 常见 的 源 代码 编辑 器 和 IDE (集成 开发 环境 ) 工具 。 大 多 数 的 编辑 器 都 支持 多 种 语言 的 代码 高 亮 、 文 本 样式 修改 和 自动 完成 等 功能 ， 更 高 级 别 的 工具 甚至 提供 代码 提示 、 方 
法 跳 转 等 功能 。 


5.1.1， 源 代码 编辑 工具 简介 


对 于 PHP、Javascript 和 HTML 等 脚本 语言 来 说 ， 很 多 时 候 开发 工作 都 是 和 字符 串 文本 〈 源 代 码 ) 打交道 。 如 果 不 要 求 开发 编辑 器 带 有 代码 调试 和 实时 编译 等 功能 ， 则 Windows 操 作 系统 自 带 的 记事 本 
就 可 以 完全 满足 编写 要 求 。 面 对 琳琅 满目 的 开发 工具 ， 开 发 者 需要 根据 自身 需求 进行 合理 选择 。 


常见 的 编程 语言 开发 工具 分 为 源 代码 编辑 器 和 集成 开发 环境 (IDE) 两 种 。 为 了 更 好 地 理解 这 两 者 的 功能 和 关系 ， 先 来 看 这 两 种 工具 的 定义 。 


1. 源 代码 编辑 器 


源 代码 编辑 器 是 开发 者 用 于 编写 计算 机 程序 的 文本 编辑 器 。 它 通常 是 一 个 独立 的 应 用 程序 ， 或 是 作为 集成 开发 环境 (IDE) 的 一 部 分 存在 ， 又 或 者 是 一 个 运行 于 浏览 器 中 的 网 页 编辑 器 。 由 于 开发 者 的 主 
任务 就 是 编写 代码 ， 因 此 源 代码 编辑 器 是 最 重要 的 编程 工具 。 


合格 的 源码 编辑 器 可 以 帮助 开发 者 更 快速 地 编写 代码 ， 所 以 一 般 的 文本 编辑 器 (例如 Windows 记 事 本 ) 虽然 可 以 用 ， 但 并 不 适合 编程 开发 。 


源 代码 编辑 器 至 少 要 支持 以 下 功能 ， 才 能 满足 快速 开发 的 需求 : 


:自动 完成 ; 
“ 自动 补 全 ; 


“ 安装 轻便 。 


只 要 满足 以 上 几 个 功能 的 编辑 器 ， 都 可 以 提高 代码 编辑 的 效率 。 此 外 ， 还 需要 考虑 到 该 工具 是 否 开 源 、 是 否 收费 、 是 否 支 持 当前 使 用 的 操作 系统 平台 等 特性 。 


下 面 列举 了 一 些 比较 著名 的 源 代 码 编辑 器 。 如 没有 特殊 说 明 ， 它 们 都 是 跨 几 个 主流 操作 系统 平台 的 。 
“Eclipse 内 置 编辑 器 ; 
“ Emacs 宏 编辑 器 ; 
. Geany 文 件 编辑 器 ; 
"Gedit 文 本 编辑 器 ; 
Intelli] IDEA 的 内 置 编辑 器 ; 
: Microsoft Visual Studio 的 内 置 编辑 器 ; 
"NetBeans 开发 工具 包 ; 
“ Notepad++ (Windows 平 台独 占 ) 开发 工具 ; 
: Sublime Text 纯 文本 编辑 器 ; 
* TextMate (Mac OS 平台 独占 ) 文本 编辑 器 ; 
“ Vvi/Vim 文 本 编辑 器 。 


有 趣 的 是 ， 在 开发 者 中 关于 “最 好 的 编辑 器 ”之 争 从 来 也 没有 停 软 过 。 著 名 的 编辑 器 Vim 和 Emacs 之 争 就 是 一 个 非常 好 的 例子 ， 虽 然 各 方 各 执 一 词 ， 互 不 相让 ， 但 是 这 已 经 成 为 一 种 重要 的 互联 网 文 
化 。 


常见 的 源 代码 编辑 器 如 图 5-1 所 示 。 


s Sublime Text KATON ‘2% 
DEA 念 ecllpse 


B GNU Emacs 


2. 集 成 开发 环境 


集成 开发 环境 (Integrated Development Environment，IDE) 是 一 种 


接口 。 


图 5-1 常见 的 源 代码 编辑 器 


有 助 程序 开发 人 员 开发 软件 的 应 用 软件 。1DE 可 以 辅助 编写 源 代码 文本 并 编译 打包 成 为 可 用 的 程序 ， 有 些 IDE 甚 至 可 以 设计 图 形 


1DE 包 括 编程 语言 编辑 器 、 自 动 构建 工具 和 代码 调试 器 。 有 的 IDE 包 含 编译 器 / 解释 器 ， 如 微软 的 Microsoft Visual Studio、 苹 果 的 Xcode。 有 些 IDE 则 不 包含 编译 器 /解释 器 ， 如 Eclipse、 
SharpDevelop 等 ， 通 过 调用 第 三 方 编译 器 来 实现 代码 的 编译 。 


有 些 IDE 还 会 包含 版 本 控制 系统 和 一 些 可 以 设计 图 形 用 户 界 | 


的 工具 。 许 多 支持 面向 对 象 的 IDE 还 包括 了 类 别 浏览 器 、 对 象 查看 器 、 对 象 结构 图 。 


提示: 目前 ， 有 一 些 IDE 支 持 多 种 编程 语言 (例如 Eclipse、NetBeans、Microsoft Visual Studio) 。 但 一 般 而 言 ，IDE 主 要 还 是 针对 某 个 特定 的 编程 语言 而 量 身 打造 ， 例 如 Visual Basic、XCode 和 JetBrains 


家 族 的 各 个 IDE。 


目前 移动 端 主流 的 IDE 工 具 ， 如 图 5-2 所 示 。 


a) Xcorde 


5.1.2 ”选择 合适 的 开发 工具 


很 多 情况 下 推荐 开发 者 直接 使 用 IDE 进 行 代码 的 开发 与 调试 。 不 过 应 上 


加 


b) Android Stadio c) PHPStorm 


图 5-2 移动 端 主流 的 IDE 工 具 


这 里 针对 不 同 的 应 用 场景 和 需求 ， 推 荐 一 些 开发 工具 。 


1. 针 对 大 规模 团队 合作 项 目 


这 类 项 目 一 般 比较 大 ， 配 合 统一 的 数据 库 和 版 本 管理 工具 使 


， 这 时 ， 如 果 1DE 拥 有 这 些 特性 ， 使 有 


PHPStorm 是 目前 最 为 火热 的 PHP 开 发 IDE， 主 要 具有 以 下 几 


' 跨 平 台 ， 目 前 支持 Windows、Mac O 


“ 具有 代码 高 亮 、 自 动 提示 等 功能 。 


“ 支持 类 模板 和 代码 片段 。 


“ 支持 一 键 代码 重 构 。 


L 点 特性 和 优势 : 


S 和 Linux 操 作 系统 。 


“内置 版 本 控制 工具 ， 代 码 状 态 一 目 了 然 ， 如 Git、SVN 等 。 


“ 内 置 数 据 库 管理 工具 。 


“ 内 置 完善 的 文档 操作 工具 ， 如 支持 PHPDoc。 


“内置 类 关系 图 管理 ， 查 看 方便 。 


' 方便 的 调试 支持 ， 如 支持 xdebug 工 具 。 


:方便 的 测试 支持 ， 如 支持 PHPUnit。 


“内置 强大 的 搜索 和 自 定义 快捷 键 功能 。 


“ 提供 各 式 各 样 的 插件 和 主题 ， 毕 竟 美 也 是 一 种 生产 力 。 


以 上 这 些 只 是 PHPStorm 的 部 分 特性 与 优点 ， 在 实际 使 用 中 可 以 提高 效率 的 地 方 还 有 很 多 ， 在 这 号 


PHPStorm 开 发 工具 的 主 界面 如 图 5-3 所 示 。 


程序 的 开发 过 程 比较 复杂 ， 从 代码 编写 到 本 地 测试 ， 再 到 最 终 上 线 到 应 用 服务 器 ， 期 间 使 用 的 开发 工具 会 各 不 相同 。 


起 来 就 会 方便 很 多 。 这 里 推荐 JetBrains 家 族 系列 的 集成 开发 环境 一 一 PHPStorm。 


就 不 全 部 列 出 。 


=: 
叶 blog blog public ) 目 index.html 


L_ 到 全 于 闽 训 有 本 | 
= © a I5| 0 笔 /index.html [ys| main js c/index.html 
Cblog I 


Ject 


1: Proj 


ESLint: Please specify path to 'eslint' package 


[ VI Lh SC 
空 , 三 线 城市 程序 员 "> 


记 blog 十 坟 L 芒 永 


<link rel="alt 


-" 王 甲 临 的 BLOG" 


library r 


6:TODO 


jnregistered VCS root | ory /Users/wangjialin/www/blog/blog/.deploy_git is ut (6 minutes ago) Material Theme - Default 


图 5-3 PHPStorm 开 发 工具 的 主 界 面 


不 过 PHPStorm 本 身 也 有 一 些 不 足 ， 资 源 占用 较 大 就 是 其 中 一 个 缺陷 。 若 开发 机 器 的 配置 比较 低 ，PHPStorm 使 用 起 来 也 会 变 得 比较 卡 顿 。 另 外 ， 在 创建 新 项 目 时 会 构建 全 文 索 引 ， 会 占用 过 多 的 系统 
资源 。 不 过 瑕 不 掩 瑜 ，PHPStorm 的 版 本 也 在 不 断 地 办 代 ， 用 户 在 使 用 时 多 加 注意 即 可 ， 并 不 妨碍 PHPStorm 成 为 优秀 的 编辑 器 。 


如 需 快速 修改 文本 ， 一 个 可 以 快速 启动 的 源 代码 编辑 器 也 许 比 庞大 的 集成 开发 环境 更 好 。 快 速 修改 文本 可 能 用 于 以 下 应 用 场景 : 


“ 修改 本 地 服务 器 配置 文件 。 


“ 查看 日 志 。 


“ 变更 文件 的 编码 格式 。 


“ 编写 说 明文 本 。 


优秀 的 编辑 器 很 多 ， 开 发 者 可 根据 自己 的 操作 系统 和 使 用 习惯 选择 即 可 。 


有 时 需要 临时 修改 应 用 服务 器 的 程序 ， 但 又 不 能 使 用 FTP 文 件 传 输 ， 这 时 就 只 能 选择 Vi/Vim 或 者 Emacs 源 代码 编辑 器 。 这 些 源 代码 编辑 器 不 仅 历史 久远 ， 甚 至 曾 引 发 了 广泛 的 讨论 。 


其 主要 的 优点 是 : 服务 器 操作 系统 一 般 内 置 ， 也 不 需要 图 形 化 界面 ， 在 命令 行 就 可 以 使 用 。 


其 缺点 也 很 明显 ， 主 要 是 : 不 支持 鼠标 操作 ， 让 入 门 门槛 高 了 许多 。 不 过 用 户 只 要 勤 加 使 用 ， 都 不 难 掌握 。 


在 服务 器 上 使 用 Vim 修 改 php.ini 配 置 文件 ， 如 图 5-4 所 示 。 


[1 
About php.ini 
PHP's initialization file, generally called php.ini, is responsible for 
configuring many of the aspects of PHP's behavior. 


PHP attempts to find and load this configuration from a number of locations. 
The following is a summary of its search order: 

SAPI module specific location. 

The PHPRC environment variable. (As of PHP 5.2.0) 

A number of predefined registry keys on Windows (As of PHP 5.2.0) 

. Current working directory (except CLI) 

5. The web server's directory (for SAPI modules), or directory of PHP 
(otherwise in Windows) 
6. The directory from 七 he --with-config-file-path compile time option, or the 
Windows directory (C:\windows or C:\winnt) 
See the PHP docs for more specific information. 
http://php.net/configuration.file 


i syntax of the file is extremely simple. Whitespace and Lines 
:Wq 


图 5-4 ”使 用 Vim 编 辑 器 编辑 php.ini 文 件 


JetBrains 公 司 旗下 有 很 多 集成 开发 环境 产品 ， 分 别针 对 不 同 的 语言 ， 如 PyCharm 和 Webstorm 等 。 这 些 集成 开发 环境 根据 语言 的 不 同 特性 ， 进 行 针 对 性 的 优化 和 设计 ， 有 着 较 高 的 用 户 使 用 体验 。 


本 节 将 讲解 PHPStorm 的 一 些 实用 小 技巧 ， 以 便 更 好 地 提高 开发 者 的 工作 效率 。 


PHPStorm 的 一 些 基本 的 操作 (如 下 载 、 安 装 等 ) 相对 简单 ， 在 这 里 就 不 再 赣 述 。 本 节 主 要 讲解 PHPStorm 的 一 些 快捷 操作 。 


PHPSstorm 本 身 提供 了 多 种 快捷 键 预 定义 规则 ， 开 发 者 可 以 方便 地 进行 自 定义 。 


这 里 以 Windows 系 统 下 的 PHPStorm 为 例 (本 实例 版 本 : 2017.2) ， 介 绍 如 何 自 定义 快捷 键 。 


1) 新 建 PHP 项 目 


这 里 创建 一 个 空 的 PHP 项 目 ， 打 开 新 项 目的 创建 界面 后 ， 选 择 左 侧 的 PHP Empty Project 项 ， 在 右 侧 操 作 界 面 中 的 Location 处 可 以 选择 合适 的 位 置 ， 其 他 几 个 选项 可 以 使 用 默认 值 ， 最 后 单 击 Create 按 
钮 即 可 完成 创建 。 本 实例 中 的 项 目 名 为 demo5。 新 的 项 目 创建 如 图 5-5 所 示 。 


加 New Project 


PHP Empty Project New project 
PhpStorm Workshop Project 


Location: Dxphpstudy\WWwWNdemo 引 


和 App Engine Project 

Composer Project PHP language level: 7.1 
入 Drupal Module CLI Interpreter: PHP 
Joomla! Integration 


@ WordPress Plugin Include Path PHP Runtime 


A Angular CHI 
的 Angulanjs 
Foundation 


号 HTML5 Boilerplate 


Provide include path 


Ua Node.js Express App 

tp React App 

3 React Native 
Twitter Bootstrap 


少 Web Starter Kit 


图 5-5 ”创建 一 个 新 的 项 目 demo5 


(2) 打开 快捷 键 设置 界面 


5-6 所 示 。 可 以 看 到 PHPStorm 对 于 快捷 键 进 行 了 详 


在 PHP 项 目 主 界面 ， 按 Ctrl+Alt+ S 快 捷 键 可 以 打开 PHPSstorm 的 设置 界面 。 随 后 在 活动 窗口 上 输入 keymap， 进 入 PHPSstorm 快 捷 键 设置 界面 ， 如 图 
细 的 划分 ， 默 认 快捷 键 有 映射 关系 的 组 合 按键 都 会 提示 。 


人 @ settings 
Q keymap Keymap 


Keymap Default 


Bz Editor Actions 


置 D0 


置 赃 


:MN da 


a) 查看 默认 的 快捷 键 列表 


Alt+Button1 Click 
trl+Alt+Shift+Button1 Clickl 
Shift+Backspace| 


b) 修改 默认 快捷 键 设 置 
图 5-6 ”快捷 键 设置 管理 
(3) 创建 自 定义 快捷 键 副 本 
为 了 不 修改 PHPStorm 自 带 的 快捷 键 ， 开 发 者 可 以 基于 系统 默认 的 快捷 键 预 置 规 则 ， 创 建 自己 的 快捷 键 副 本 规则 ， 然 后 再 进行 个 性 化 的 修改 。 
@ 单 击 快捷 键 模板 下 拉 列 表 Default 后 面 的 设置 按钮 ， 在 出 现 的 菜单 中 选择 Duplicate.… 命 令 ， 手 动 修改 Default copy 文 本 为 wangjialin。 这 样 一 个 基于 系统 Default 模 板 的 快捷 键 副 本 就 创建 完毕 了 。 


@ 单 击 窗口 的 Apply 按 钮 ， 保 存 操作 过 的 内 容 ， 自 定义 快捷 键 副本 ， 如 图 5-7 所 示 。 


wangjlalin 


Default 
wangjialin 


(4) 自 定 义 快捷 键 


@ 为 了 方便 演示 ， 这 里 修改 快速 搜索 的 快捷 键 (默认 为 Double Shift， 即 按 Shift 键 两 次 ) 。 在 keymap 窗 口 的 右上 方 ， 有 一 个 子 搜索 输入 框 ， 输 入 search 文 本 ， 在 结果 中 右 击 Other 分 组 下 的 Search 
Everywhere 选 项 ， 如 图 5-8 所 示 。 


Search Everywhere 
Add Keyboard Shortcut 


Search Add Mouse Shortcut 


Add Abbreviation 
图 5-8 选择 需要 修改 的 快捷 键 选项 
@ 随 后 在 出 现 的 菜单 中 ， 选 择 Add Keyboard Shortcut 命 令 ， 出 现 快 捷 键 自 定义 窗口 ， 将 快捷 键 定义 为 At+3， 单 击 OK 按钮 后 保存 。 最 后 别 忘 记 在 设置 窗口 中 单 击 Apply 按 钮 ， 让 操作 生效 ， 如 图 5-9 所 


(5) 验证 自 定 义 快捷 键 是 否 生效 


回 到 PHP 项 目 主 界面 ， 按 Alt+ 3 快捷 键 ， 效 果 如 图 5-10 所 示 ， 说 明 自 定义 快捷 键 已 经 生效 。 


四 Keyboard Shortcut 


Search Everywhere In Other 


Alt+3 


Second stroke: 


5-9 自 定义 快速 搜索 的 快捷 键 


Search Everywhere: Include non-project items (Alt+ 3) 


Q 


Nothing to show 


图 5-10 使 用 自 定义 快捷 键 进行 快速 搜索 


2. 使 用 快捷 键 新 建 目录 /文件 


PHPStorm 可 以 快速 创建 各 式 各 样 的 文件 和 目录 ， 还 可 以 创建 PHP 


(1) 快速 创建 文件 目录 


县 以 创 | 对 


的 模板 文件 。 这 号 一 个 PHP 类 文件 和 index.php 入 口 


文件 为 例 ， 讲 解 相关 快捷 键 的 使 


方法 。 


选中 demo5 目 录 ， 按 Alt+Insert 快 捷 键 ， 弹 出 “新 目录 /文件 ”的 类 型 列表 框 ， 使 用 上 下 方向 键 选择 需要 创建 的 文件 类 型 。 这 里 选中 Directory 类 型 后 ， 按 回 车 键 ， 则 出 现 文件 夹 命名 窗口 ， 输 入 lib 后 保 
存 ， 如 图 5-11 所 示 。 

(2) 在 项 目 根 目录 下 创建 PHP 文 件 

同样 使 用 Alt+Insert 快 捷 键 创建 PHP 文 件 。PHPStorm 本 身 自 带 PHP 文 件 、PHP 类 文件 的 模板 ， 先 来 看 如 何 创建 PHP 脚 本 文件 。 选 中 PHP File 类 型 后 ， 创 建 名 为 index 的 PHP 文 件 ， 如 图 5-12 所 示 。 


风 New Directory 


lib| 


Flle name: 


File extension: p 


完成 操作 


后 ， 可 以 看 到 index.php 文 件 中 


<?php 
Pe 

* Created by PhpStorm. 
* User: Administrator 
* Date: 2017/10/6 0006 
* Time: 10:16 

A 


(3) 在 项 目 lib 目 录 下 创建 PHP 类 文件 


PHPSstorm 默 认 提 供 了 PHP 类 文件 的 创建 模板 ， 创 建 类 文件 和 创 寻 


Enter new directory name: 


图 5-11 在 项 目下 创建 名 为 ib 的 目录 


@ Create New PHP File 


index 


hp 


5-12 使 用 快捷 键 创建 文件 


自动 定义 了 PHP 定 义 符 和 一 些 基本 的 注释 : 


目 列表 中 选中 lib 目 录 ， 按 Alt+lnsert 键 ， 选 择 PHP Class 类 型 


EPHP 文 件 过 程 类 似 ， 在 项 


等 信息 ， 这 里 新 增 一 个 User 类 ， 如 图 5-13 所 示 。 
创建 完成 后 ， 简 单 地 定义 一 个 User 类 ， 编 写 一 些 SET/GET 方 法 ， 类 定义 的 核心 方法 如 下 : 


namespace lib; 

/** 

* 用 户 类 

* Class User 

4 

class User 

{ 
Private Sname = "''; 
Private $sex = 0; 


/x 


后 按 回 车 键 即 可 。 在 窗 


口中 填写 类 名 、 命 名 空间 


* User constructor. 

* Q@param string Sname 

* @param int $sex 

wf 

public function _ construct (Sname = 无 名 慌 "S56ex 二 :0} 
Sthis->name = $name; 


Sthis->sex = $sex; 
} 


/** 
* Get 方 法 ， 获 取 用 户 名 

* @return string 

六 

Public function getUserName () 


return ' 用 户 名 : ' . $this->name .'<br>'; 


/x# 
* Get 方 法 ， 获 取 用 户 性 别 


* @return string 
六 


Public function getUserSex () 


return ' 用 户 性 别 : ' . (Sthis->sex == 0 ? ' 男 ':' 女 ') .'<br>'; 


@ Create New PHP Class 


Class 


Name: Usel| 


Namespace: 


Use Ctrl+ 衬 和 格 for namespace completion 


File name: User 六 | 


Directory: 器 ...\demo5\lib 


Use Ctrl+ 空 格 for path completion 


Kind: Class 


Flle extension: php 


图 5-13 快速 创建 PHP 类 


User 类 定义 完毕 后 ， 在 index.php 文 件 中 实例 化 访问 ， 代 码 如 下 : 


<?php 

require once _DIR _. '/lib/User.php'; 
$user = new \lib\User('wangjialin' , 0); 
Print r ($user->getUserName () ); 


print r ($user->getUserSex()); 


器 
里 


然 demo5 项 目 中 文件 不 多 ， 但 是 实际 项 目 中 的 文件 、 目 录 和 方法 却 数不胜数 。 如 果 不 通 过 一 些 快速 方式 进行 检索 ， 则 查询 效率 会 很 低 。PHPStorm 本 身 提供 了 如 下 一 些 默 认 快 捷 键 可 供 检索 使 用 。 


: 快速 查找 文件 : Crtl+Shift+N。 
“ 快速 查找 类 : Crtl+N。 


“ 快速 查找 方法 : Crtl+Shift+Alt+N。 


这 三 组 快捷 键 在 项 目 中 使 用 率 非常 高 。 这 里 还 是 以 User 类 和 index.php 入 口 文件 为 例 ， 简 单 说 明 如 下 。 


(1) 快速 查找 文件 


按 Crtl+Shift+N 键 后 ，PHPStorm 会 弹出 一 个 窗口 ， 开 发 者 可 以 输入 想 要 搜索 的 文件 名 ， 完 成 后 会 在 下 方 出 现 检索 的 结果 列表 (如 图 5-14 所 示 ) 。 通 过 键盘 的 上 下 方向 键 可 以 选择 需要 查看 的 文件 ， 按 
回 车 键 可 以 进入 查看 。 


Enter file name: Include non-project files (Ctrl+ Shift+N) 


QA Weses 


EE 9.php (daemo5\1lib) 
上 和 


Press Ctrl+[9] 


or Ctrl+ 向 下 箭头 to navigate through the history 


图 5-14 快速 定位 文件 
(2) 快速 查找 类 文件 


为 了 方便 演示 ， 新 创建 UserAddress 类 ， 用 来 区 分 类 查询 的 结果 。UserAddress 类 的 定义 与 User 类 似 ， 其 中 核心 定义 如 下 : 


namespace lib; 


J 

* 用 户 地 址 信息 类 

* Class UserAddress 
* @package lib 

Wd 


class UserAgddress 
{ 
private $address = ' 北 京 市 海淀 区 '; 


A 
* 获取 用 户 地 址 
* @return string 
ef 
public function getUserAddress () 
了 
return ' 当 前 用 户 的 地 址 为 : ' . $this->address.'<br>'; 
} 
} 


定义 完成 后 ， 按 Crtl+ N 快 捷 键 ， 在 弹出 的 窗口 中 输入 User 关 键 字 再 进行 检索 ， 会 发 现 User 和 UserAddress 类 都 会 被 匹配 成 功 ， 如 图 5-15 所 示 。 


Enter class name: Include non-project classes (Ctrl+N) 


to navigate through the history 


5-15 快速 查找 类 文件 


(3) 快速 查找 方法 


按 Crtl+Shift+Alt+N 键 ,输入 get 关 键 字 ， 查 找 所 有 类 中 定义 的 带 有 get 关 键 字 的 方法 ， 结 果 如 图 5-16 所 示 。 


Enter symbol name: Include non-project symbols (Ctrl+Alt+Shift+N) 


EUserAddress UserAddress .../1ib 
getUserName Se /a 
erDS 
关头 or Ctrl+ 向 下 箭头 to navigate through the history 
图 5-16 ”快速 查找 方法 
公所 示 : 项 目 开发 中 ， 若 觉得 快捷 键 的 组 合 过 长 ， 过 于 烦琐 ， 可 按照 自己 的 习惯 自行 定义 。 


4 多 文件 快速 切换 
在 同时 编辑 两 个 ， 甚 至 多 个 文件 时 ， 可 以 使 用 快捷 键 Crtl+E 调 取出 最 近 编辑 过 的 两 个 文件 ， 使 用 上 下 方向 键 和 回 车 键 ， 实 现 快速 切换 的 效果 ， 如 图 5-17 所 示 。 


Recent Flles 


“Project UserAddress.php 


食 Favorltes User.php 
TODO 
Structure 
Database 
tvent Log 


-| Terminal 


图 5-17 在 两 个 文件 中 进行 快速 切换 


5. 快 速 搜索 设置 项 


PHPStorm 的 设置 项 众多 ， 不 过 系统 提供 了 全 局 的 搜索 快捷 键 。 只 需要 按 默 认 的 Ctrl+ shift+A 键 ， 即 可 调 出 搜索 框 。 以 快捷 键 功 能 为 例 ， 一 般 有 两 步 操作 ， 需 要 先 打 开 Setting 设 置 窗 口 ， 再 输入 
keymap 进 行 搜索 ， 但 使 用 快速 搜索 设置 项 就 会 简化 一 步 操 作 。 搜 索 结果 如 图 5-18 所 示 。 


Enter action or option name: 


Q keyma 四 


keymap 

Keymap Reference 

Keymap Settings 
Quick Switch Scheme... 

Add keymap 

New keymap 

Set keymap 


Emacs keymap 


网 


5-18 全 局 快速 检索 设置 项 


5.2.1 节 中 介绍 了 如 何 快速 创建 PHP 普 通 /类 文件 。PHPStorm 创 建 的 普通 文件 会 有 头 部 注释 ， 而 类 文件 带 有 命名 空间 和 类 结构 的 定义 ， 这 里 就 用 到 了 PHPStorm 的 文件 模板 。 


过 


使 用 系统 自 带 的 文件 模板 创建 的 PHP 文 件 ， 都 会 带 有 一 组 头 部 注释 ， 例 如 : 


<?php 

/** 

* Created by PhpStorm. 
* User: Administrator 
* Date: 2017/10/6 0006 
* Time: 15:23 


PHPStorm 自 带 的 文件 模板 不 仅 支持 大 部 分 主流 的 语言 离线 ， 还 允许 用 户 自 行 定 义 ， 功 能 十 分 强大 。 在 实际 操作 中 ， 要 想 查看 已 有 文件 模板 ， 首 先 需 按 Ctrl+ Shift+A 快 捷 键 调 出 设置 的 全 局 搜索 窗口 ， 
随后 输入 file and template 文 本 ， 在 结果 列表 中 ， 通 过 上 下 方向 键 选中 File Template 类 型 后 按 回 车 键 ， 就 可 以 进入 文件 模板 的 设置 界面 ， 如 图 5-19 所 示 。 


加 Settings x 


Q file and temple Editor > File and Code Templates 


Scheme: Default 


Files Includes Code 


ur 口 

起 HTML File 

总 HTML4 File 

起 XHTML File 

让 css File 

二 JavaScript File 

六 AMD Javascript File 

各 TypeScript File 

tsconfig.json 

二 Less File 

六 Sass File 

晶 sCss File 
PHP File 
二 PHP Class 
PHP Interface 
MR PHP Trait Reformat according to style Enable Live Templates 
人 钢 PHPUnit Test 
钢 PHPUnit 6 Test 
氏 WordPress Main Plugin File This is a built-in template used each time you create a new PHP class by selecting New | PHP Class from the 
| CoffeeScript File popup menu in one of the project views. 

[a CoffeeScript Class The template is editable. Along with PHP statements, expressions and comments you can also use the predefined 
-tf el eheat variables listed below. Every variable will be expanded like macros into the corresponding value. 
fe eshee 


By means of the #parse directive, you can include templates from the Includes tab by specifying the full name of 
the desired template as a parameter in quotation marks. 


File and Code Templates 


Description 


Predefined variables will take the following values: 
S${FILE_NAME} current file name 


S{USER} current user system login name 


5-19 PHPStorm 内 置 了 大 量 的 文件 模板 


PHPStorm 系 统 内 置 的 模板 已 经 可 以 满足 一 般 项 目的 需求 。 使 用 自 定义 模板 ， 目 的 是 为 了 创建 一 些 特定 的 类 或 者 文件 。 举 例 说 明 ， 在 项 目 中 创建 自 定义 模型 (Model) ， 一 般 会 继承 一 个 模型 的 父 类 
(BaseModel) ， 这 个 父 类 拥有 一 些 通用 的 属性 和 方法 ， 如 数据 库 连 接 对 象 、 数 据 查 询 方法 和 公共 属性 等 。 下 面 演示 如 何 创建 一 个 自 定义 模型 的 文件 模板 。 


(1) 创建 BaseModel 模 型 类 


在 demo5 项 目的 lib 目 录 下 ， 新 增 BaseModel.php 类 文件 ， 定 义 类 时 只 有 一 个 query () 方法 ， 来 模拟 SQL 语句 的 执行 。 其 核心 代码 如 下 : 


<?php 
namespace lib; 


/** 

* 基础 模型 类 

* Class BaseModel 
* @package lib 

要 人 

class BaseModel 


Ee 
* 执行 SQL 语 句 ( 模 拟 ) 
* @param $sql 
* @return string 
wy 
public function query ($sql) 


return "执行 SQL 语句 : ' .$sql; 
} 


(2) 创建 自 定义 模板 文件 


通过 快捷 键 进入 File Template 管 理 界面 ， 单 击 File 列 表 上 的 “+” 号 按钮 ， 修 改 文件 模板 名 称 为 PHP Model， 模 板 内 容 如 下 : 


<?pPhp 

#if (${NAMESPACE}) 
namespace ${NAMESPACE}; 
#end 


use lib\BaseModel; 


/*# 
* ${NAME} 模 型 类 
才 
class ${NAME} extends BaseModel{ 
// 初始 化 方法 
public function init() 
t 


} 
} 


单 击 窗口 中 的 OK 按钮 ， 即 可 完成 文件 模板 的 保存 。 


(3) 使 用 自 定义 模板 创建 模型 类 


[ 


在 demo5 项 目 中 创建 model 目 录 ， 定 位 到 model 目 录 上 ， 使 用 Alt+lnsert 快 捷 键 创建 新 文件 。 此 时 发 现 弹出 列表 框 中 已 经 有 PHP Model 类 型 ， 选 中 后 填写 对 应 的 类 信息 ， 如 图 5-20 所 示 。 


加 New PHP Model 


File name: User 


NAMESPACE: model 


图 5-20 ”使 用 文件 模板 创建 自 定义 模型 类 文件 


单 击 OK 按 钮 后 ， 在 model 目 录 下 ， 就 会 出 现 User.php 模 型 类 文件 。 自 动 创 建 的 代码 如 下 : 


<?php 
namespace model; 
use lib\BaseModel; 


/** 
* User 模 型 类 
区 


class User extends BaseModelf{ 


// 初始 化 方法 
public function init() 
{ 
} 
i 


(4) 验证 模型 类 


修改 index.php 文 件 代 码 ， 引 入 User 模 型 类 ， 并 执行 query () 方法 。 代 码 如 下 : 


<?php 
use lib\User; 
use model\User as UserModel; 


// 类 文件 自动 加 载 


require once _DIR_ . '/autoload.php'; 
// 实例 化 用 户 类 
$user = new User('wangjialin' , 0); 


print r ($user->getUserName () ) 7 
print r ($user->getUserSex ()); 


// 实例 化 用 户 模型 类 
$userModel = new UserModel (); 
Print r ($userModel->query ('select * from db user')); 


执行 结果 如 下 ， 说 明 自 定义 模板 生成 的 代码 可 以 正常 地 执行 : 


用 户 名 : wangjialin 
用 户 性 别 : 男 
执行 SQL 语句 :select * from db_user 


若 需要 定义 其 他 类 型 的 模板 ， 可 以 参考 PHPstorm 系 统 内 置 的 模板 规格 。 


人 提示 : 在 index.php 文 件 中 使 用 了 自动 加 载 ， 所 以 不 需要 手动 引入 lib 和 model 文 件 夹 中 的 类 文件 。autoload.php 文 件 的 核心 函数 为 spL_autoload_register () 。 


3. 自 定义 代码 片段 模板 


相 比 文件 模板 ， 代 码 片段 模板 在 实际 代码 开发 过 程 中 用 得 更 频繁 ， 这 里 以 自 定义 一 个 格式 化 输出 语句 组 合 为 例 ， 讲 解 如 何 创建 一 个 代码 片段 模板 。 


(1) 进入 Live Templates 设 置 


在 PHPStorm 中 ， 代 码 片段 被 称 为 Live Templates， 通 过 全 局 搜索 Live Templates 关 键 字 可 以 找到 


设置 界面 ， 可 以 看 到 PHPStorm 预 定义 了 大 量 的 代码 片段 ， 如 图 5-21 所 示 。 


人 @ Settings > 


Q live templates Editor > Live Templates 


By default expand with Tab 


《轩辕 | 久 


Live Templates 


四 


人 


人 


5-21 查看 预定 义 代码 片段 


(2) 创建 Live Templates Group 群 组 


在 设置 界面 的 右 侧 ， 单 击 “+ ”号 按钮 后 出 现 二 级 菜单 ， 选 择 Templates Group… 命 令 创建 代码 片段 组 ， 组 名 为 wangjialin， 如 图 5-22 所 示 。 


上 合 Create New Group x 


. Enter the new group name: 
1. Live Template ee 


wangjialin| 


2. Template Group... 


5-22 ”创建 Live Templates Group 群 组 


(3) 创建 Live Templates 代 码 片段 


完成 上 述 操作 后 ， 在 列表 上 单 击 组 名 称 (wangjialin) ， 再 单 击 右 人 出 “+” 号 按钮 后 出 现 二 级 菜 


击 Ok 按 钮 后 自 定 义 代码 片段 ， 操 作 如 图 5-23 所 示 。 


Abbreviation: pp Description: Print Pre Code 


一 


Template text: 


| a 导 Live Template | echo "<pre>";print r($VA 


Options 


] 2. Template Group... 


Expand with Default (Tab) 


Reformat according to style 


5-23” 自 定义 代码 片段 


这 里 定义 了 代码 片段 的 提示 关键 字 为 pp， 描 述 为 Print Pre Code， 内 容 为 : 


echo "<pre>";print r($VARS$);die; 


其 中 ，“$VAR$” 就 是 模板 的 动态 变量 ， 两 个 $ 符 号 之 间 的 名 称 可 以 自 定义 。 


(4) 完成 创建 Live Templates 


最 后 单 击 输入 框 下 方 的 Define 按 钮 ， 定 义 Live Templates 代 码 片段 的 应 用 范围 ， 这 里 只 需要 设置 类 型 为 PHP 即 可 ， 如 图 5-24 所 示 。 


Abbreviation: 


Template text: 


FT 


echo 


Oe 


Applicable in PHP; PHP: comment, string literal, expression, statement, class member. Change 


图 5-24 设置 Live Templates 代 码 片 段 的 应 用 范围 


最 后 别 忘记 单 击 OK 按钮 保存 设置 。 


(5) 使 用 Live Templates 代 码 片段 


网 


在 PHP 脚 本 文件 中 的 任意 位 置 输入 pp 关键 字 ， 效 果 如 图 5-25 所 示 。 


PP Print Pre Code: 
Davparameeergstatus Sram 
PgPDEeonnect resource 


ore end aye | bool 


PaaporE 了 ELE 
pg prepare resource 
Porput oline bool 
Bos EC ESDEEESn 3LIRVIE 
ES int 
pg query params resource 


Ctrl: + 向 下 箭头 and Ctrl+ 和 向 上 第 头 will move caret down and up in the editor >> Tn 


图 5-25 ”自动 提示 定义 的 Live Templates 信 息 


按 Tab 键 后 ,会 自动 在 当前 位 置 生 成 代码 片段 ， 如 


// 实例 化 用 户 模型 类 
rModel new UserModel ();，} 


5-26 所 示 。 


[ 


print r($userModel->query( sql: 'BETSeE0 ROM 


echo "<pre>";print r($userModel) ;die; 


图 5-26 ”在 代码 中 使 用 Live Templates 代 码 片 段 


人 提示: Live Templates 不 仅 可 以 创建 PHP 代 码 片段 ， 而 且 对 HTMI、JavaScript 和 CSS 等 主流 的 程序 格式 也 都 支持 。 


当 项 目 越 来 越 庞大 ， 需 要 批量 修改 变量 或 合并 重复 代码 时 ， 手 动 操作 难免 出 现 差错 ， 此 时 就 需要 开发 工具 的 支持 。 


在 实际 的 开发 过 程 中 ， 每 个 类 和 方法 都 不 宜 编写 得 过 于 复杂 ， 这 样 会 使 代码 的 可 读 性 和 可 维护 性 变 差 ， 对 PHP 语 言 来 说 ， 比 较 常见 的 操作 就 是 合并 一 些 会 重复 使 用 的 代码 片段 ， 使 之 成 为 类 的 独立 方 
， 这 样 可 以 减少 同一 个 类 文件 中 重复 代码 的 数量 。 


PHPStorm 本 身 自 带 了 很 多 代码 重 构 的 使 用 方式 ， 这 里 重点 来 看 方法 重 构 。 为 了 方便 演示 ， 还 是 使 用 demo5 实 例 ， 修 改 UserAddress 类 增加 一 些 方法 ， 模 拟 实现 新 增 用 户 地 址 的 功能 。 核 心 代码 如 下 : 


xy 
* 插入 新 地 址 (模拟 ) 
* @return string 
wy 


public function insert () 


{ 
// 获取 数据 模拟》 
$data = $ GET; 
// 数据 验证 
if(!isset($data['uid']) || !$data['uid']) 


$this->error (' 用 户 ID 不 能 为 空 ') ; 
} 
if(!isset($data['address']) || !$data[l'address']) 


{ 
$this->error(' 用 户 地 址 不 能 为 空 ') ; 


l 

// 新 增 数据 (模拟 ) 
S$this->addNewData ($data); 

// 返回 成 功 的 提示 信息 

return $this->success(' 保 存 成 功 ') 


针对 上 述 代码 ， 可 以 把 数据 验证 部 分 的 代码 单独 提取 出 来 ， 让 其 成 为 独立 的 方法 。 在 PHPSstorm 中 操作 的 步骤 如 下 。 


(1) 选中 代码 ， 选 择 重 构 方式 


选择 需要 重 构 的 代码 块 后 ， 按 Ctrl+Alt+ M 快 捷 键 (或 者 使 用 Ctrl+Alt+ Shift+T 快 捷 键 后 选择 第 7 个 选项 ) ， 输 入 需要 重 构 的 方法 名 ， 其 他 使 用 默认 值 即 可 ， 如 图 5-27 所 示 。 


全 Extract Method 


Method: 


Name: 


checkValidatd| 
Declare static Generate PhpDoc 
Output variable(s) 


$data 


Return output variable(s) through: 


®| Return statement 


Parameter(s) passed by reference 


Parameter 
$data 


Signature preview 


public function checkValidate( 
$data 


图 5-27 重 构 代码 为 方法 
(2) 自动 方法 重 构 


随后 单 击 Refactor 按 钮 ，PHPStorm 会 自动 重 构 方法 ， 并 应 用 在 原 代码 片段 处 。 重 构 的 方法 如 下 : 


tal'a ']) || !$data[l'address']) { 
or (' 用 户 地 址 不 能 为 空 ') ; 


PHPStorm 会 对 系统 重 构 的 方法 进行 格式 检测 ， 避 免 出 现 语法 错误 。 模 拟 地 址 写 入 方法 在 重 构 后 代码 如 下 : 


Visibility: 
ee Public 
Protected 


Private 


xy 
* 插入 新 地 址 (模拟 ) 
* @return string 


uf 


public function insert () 


// 获取 数据 (模拟 ) 
$data = $_GET; 


{ 


// 数据 验证 


S$data = $this->checkValidate ($data); 
// 新 增 数据 (模拟 ) 

$this->addNewData ($data); 

// 返回 成 功 的 提示 信息 

return $this->success(' 保 存 成 功 '); 


人 提示; 重 构 的 代码 片段 ， 不 能 带 有 etum 关 键 字 ， 否 则 无 法 重 构 。 


虽然 可 以 使 用 Ctrl+ R 快 捷 键 对 某 个 关键 字 进行 批量 的 修改 ， 但 是 无 法 控制 范围 ， 所 以 这 时 候 就 可 以 使 用 多 点 编辑 了 。 还 是 以 上 面 讲 的 重 构 的 方法 checkValidate () 为 例 ， 实 现 批量 修改 所 有 的 $data 变 


量 为 gnew_data， 具 体操 作 如 下 。 


(1) 选择 变量 名 称 


在 checkValidate () 方法 内 ， 选 中 任意 的 $gdata 变 量 ， 按 Shift+F6 快 捷 键 ， 系 统 会 给 出 修改 提示 ， 并 默认 选择 方法 中 所 有 名 为 gdata 的 变量 ， 如 图 5-28 所 示 。 


到 党 村 


* @param $data 
* @return mixed 


WE 


public function checkValidate($data) 


{ 


data 
Ji 了 人、 Press Shift+F6 to show dialog with more options 
// 数据 验证 


目 了 hv 
if (!lisset(Wasea['uid']) || 1 [uid']) { 
$this->error( msg: 用户 ID 不 能 为 空 " ) ; 


if (!isset($data['address']) || !$data['address']) { 
$this->error( msg:' 用 户 地 址 不 能 为 空 '); 


} 


return $data,; 


5-28 通过 快捷 键 选择 需要 修改 的 变量 名 


(2) 变量 参数 的 批量 修改 


此 时 输入 $new_data 后 ， 其 他 的 变量 名 会 自动 修改 ， 如 图 5-29 所 示 。 


/** 

+ @param $new data 

* @return mixed 

EA 
public function checkValidate($new data) 
I 


A 
if (!isset($new data['uid']) || !$new data['uid']) { 


$this->error( msg:“ “用户 ID 不 能 为 空 ); 

j) 

if (!lisset($new data['address']) || !$new data['address']) { 
$this->error( msg: ' 用 户 地 址 不 能 为 空 ' ) ; 

} 


return $new data; 


图 5-29 ”成 功 批量 修改 变量 名 


在 PHP 语 言 发 展 的 初期 ， 没 有 一 个 好 用 的 依赖 关系 管理 工具 ， 这 导致 开发 者 在 引入 各 种 类 库 时 ， 将 大 量 的 精力 浪费 在 第 三 方 包 的 引入 和 管理 上 。 而 Composer 的 出 现 ， 让 开发 者 真正 地 解脱 了 出 来 ， 让 
其 更 加 专注 于 业务 逻辑 。 


本 章 将 详细 介绍 Composer 的 使 用 ， 并 最 终 帮 助 开发 者 提交 自己 的 类 库 到 线 上 ， 真 正 实 现 “ 一 次 提交 ， 处 处 安装 ”的 效果 。 


在 开发 环境 中 成 功 安装 了 Composer 工 具 后 ， 开 发 者 就 可 以 使 用 相应 的 功能 。 本 节 以 一 个 完整 的 操作 实例 开始 ， 讲 解 如 何 使 用 Composer 的 常用 命令 。 


在 讲解 Composer 命 令 之 前 ， 先 通过 一 个 实例 了 解 Composer 的 完整 使 用 过 程 ， 随 后 再 深入 学 习 Composer 的 进 阶 命令 。 


下 面 将 讲解 用 Composer 快 速 引 入 PHPMailer 工 具 (用 PHP 发 送 邮件 的 类 库 ) ， 并 最 终 实例 化 使 用 。 


(1) 在 PHPStorm 中 新 建 项 目 


创建 项 目 目录 demo6， 新 增 index.php 入 口 文 件 ， 增 加 两 行 代码 来 定义 页 面 编码 ， 内 容 如 下 : 


<?php 
header ('Content-type:text/html;charset=utf-8'); 
echo ' 项 目 入 口 文件 <br>'; 


(2) 在 Packagist 资 源 库 中 检索 工具 包 


因为 在 Packagist 资 源 库 中 ， 每 个 工具 包 都 有 唯一 的 名 称 ， 所 以 在 安装 前 需要 知道 PHPMailer 在 Composer 中 的 唯一 标识 ， 才 能 执行 安装 操作 ， 执 行 以 下 命令 : 
composer search phpmailer 


部 分 执行 结果 如 下 : 


Ci:NphpStudyNWWWNN\demo6>composer search phpmailer 

phpmailer/phpmailer PHPMailer is a full-featured email creation and transfer 
class for PHP 

swiftmailer/swiftmailer Swiftmailer, free feature-rich PHP mailer 
Phpmailer/phpmailer 

Zyx/zyx-phpmailer PHPMailer integration for Yii 2 framework 
adrianorsouza/codeigniter-phpmailer CodeIgniter Mail Plugin Powered by 
PHPMailer Library 

yuan1994/tp-mailer A powerful and beautiful php mailer for All of ThinkPHP 
and Other PHP Frameworks based SwiftMailer 

rmrevin/yii2-postman Mail module for Yii2. 

locomotivemtl/charcoal-email Email sending and queueing for Charcoal 


voku/swiftmailer Swiftmailer, free feature-rich PHP mailer 
qu-modules/qu-phpmailer ZF2 module for PHPMailer 
phpmailerflamin/phpmailer PHPMailer FEditado para menos arquivos 
kruisdraad/phpmailer PHPMailer is a full-featured email creation and 
transfer class for PHP 


结果 返回 了 Composer 在 Packagist 中 检索 的 结果 列表 ， 发 现 PHPMailer 类 库 的 提供 商 不 只 一 家 。 随 后 需要 开发 者 根据 列表 项 提示 简单 筛选 用 哪个 标识 进行 安装 。 


(3) 使 用 Composer 命 令 安装 PHPMailer 


根据 上 面 步骤 返回 的 搜索 结果 ， 在 已 创建 项 目的 根 目录 (demo6) 下 执行 以 下 命令 : 


composer require phpmailer/phpmailer 


执行 后 ， 返 回 如 下 结果 ， 则 说 明 安 装 成 功 。 


Ci:NphpStudyNWWWNdemo6>cormposer require phpmailer/phpmailer 

Using version ^6.0 for phpmailer/phpmailer 

./composer.json has been created 

Loading composer repositories with package information 

Updating dependencies (including require-dev) 

Package operations: 1 install, 0 updates, 0 removals 

- Installing phpmailer/phpmailer (v6.0.1): Loading from cache 
phpmailer/phpmailer suggests installing psr/log (For optional PSR-3 debug 
logging) 

Phpmailer/phpmailer suggests installing league/oauth2-google (Needed for 
Google XOAUTH2 authentication) 

phpmailer/phpmailer suggests installing hayageek/oauth2-yahoo (Needed for 
Yahoo XOAUTH2 authentication) 

phpmailer/phpmailer suggests installing stevenmaguire/oauth2-microsoft 
(Needed for Microsoft XOAUTH2 authentication) 

phpmailer/phpmailer suggests installing symfony/polyfill-mbstring (To 
support UTF-8 if the Mostring PHP extension is not enabled (^1.2)) 
Writing lock file 

Generating autoload files 


此 时 回 到 demo6 项 目 根 目录 ， 执 行 命令 前 只 有 index.php 一 个 脚本 文件 ， 而 此 时 Composer 却 自动 生成 了 很 多 文件 和 目录 ， 如 


项 目 根 目录 


6-5 所 示 。 


[ 


composer 目 录 
第 三 方 类 库 目 录 


vendor 


autoload.php 


composer.json 文 件 


composer.lock 文 件 


图 6-5 ”Composer 简 单 架构 说 明 


通过 浏览 这 些 目录 和 文件 ， 此 时 大 概 可 以 知道 vendor 目 录 存 储 的 是 Composer 下 载 和 安装 的 类 库 、autoload.php (自动 加 载 的 文件 ) 。 其 他 文件 的 用 法 可 以 先 暂 时 不 了 解 ， 后 面 会 详细 说 明 。 


(4) 在 项 目 中 使 用 PHPMailer 


只 需要 手动 引入 autoload.php 文 件 ， 就 可 以 使 用 Composer 安 装 的 包工 具 了 。 修 改 index.php 脚 本 文件 ， 增 加 以 下 代码 : 


// 引入 Composer 自动 加 载 文件 

require once _DIR__.'/vendor/autoload.php'; 
// 实例 化 PHPMailer 对 象 

Smailer = new \PHPMailer\PHPMailer\PHPMailer (); 
// 在 浏览 器 中 打印 并 查看 实例 对 象 的 结构 


var dump ($mailer); 


随后 在 浏览 器 中 访问 index.php， 结 果 如 图 6-6 所 示 ， 说 明 工具 使 用 成 功 。 


项 目 入 口 文件 


D:\phpstudy MNNdemod\index. php :10: 

object (PHPYaiITer [PHPYaiI er PHPYaiTer) [| 
public Priority => null 
public CharSet => string iso-8859-1 [Yength=70) 
public ContentType => string text/plain (Iength=70) 
public Encoding => string 8bit (Iensth=4) 
public Errorlnfo => string [iJength=0) 
public From => string root@localhost (Yensth=74) 
public FromName => string Root User [Iength=9) 
public Sender -=> sting ' (Yensth=0) 
pubiic Subiject => string [iIensth=0) 
public Body => strine ” (ITength=0) 
public AltBody => string [Iength=0) 
public Tcal” => string ”” [Tength=0) 
protecteg MIMEBody => string ” [Iiength=0) 
protaecteg MINEHeader => strine ” (iengsth=0) 
protecteg mailHeader => string ”” [iength=0) 


? ， 


图 6-6 ”使 用 Composer 安 装 的 PHPMailet 工 具 


6.2.2 ”认识 composerjson 和 composer.lock 文 件 


在 Composer 的 使 用 过 程 中 ， 理 解 与 使 用 composer.json 和 composer.lock 两 个 文件 最 为 重要 ， 本 节 将 会 重点 讲解 相关 内 容 。 


1.composerjson 文 件 


在 6.2.1 节 中 ， 通 过 命令 行 安装 使 用 了 PHPMailer 类 库 ， 项 目 根 目录 下 生成 了 composerjson 文 件 ， 该 文件 包含 了 项 目 依赖 定义 和 其 他 的 一 些 元 数据 。 下 面 简单 介绍 composerjson 文 件 的 使 用 方法 。 


(1) 包 名 称 。 


还 是 以 本 地 的 demo6 项 目 为 例 ， 在 安装 类 库 过 程 中 自动 创建 的 omposer.json 文 件 内 容 如 下 : 


{ 
"require":{ 
"phpmailer/phpmailer":"^6.0" 
} 
i 


在 这 个 结构 中 ，require 定 义 了 要 引入 的 包 名 称 (phpmailer/phpmailer) 和 版 本 号 (^6.0) 。 在 6.2.1 节 中 也 讲 到 过 ， 获 取 包 名 称 可 以 通过 composer search 命 令 ， 或 是 直接 在 Packagist 网 站 上 进行 检 


包 名 称 使 用 了 类 似 命名 空间 的 命名 方法 ， 目 的 是 为 了 在 同一 个 项 目 中 ， 人 允许 用 户 引入 名 字 相 同 但 由 不 同 开发 者 提供 的 包 。 举 例 来 说 ， 王 大 力 在 项 目 中 引入 了 phpmailer/phpmailer 包 后 ， 发 现 还 需要 使 
“others/phpmailer” 包 中 的 一 个 功能 ， 此 时 的 包 命名 机 制 就 可 以 规避 重 名 问题 。 


在 Packagist 中 可 以 搜索 到 支持 不 同 框架 的 不 同 phpmailer 包 ， 如 图 6-7 所 示 。 


phpmailer/phpmailer (virtual Package) 


zyx/zyx-phpmailer 


PHPMailer integration for Yii 2 framework 


adrianorsouza/codeigniter-phpmailer 


Codelgniter Mail Plugin Powered by PHPMailer Library 


图 6-7 可 以 搜索 到 支持 Yi、CI 框 架 的 PHPMailer 包 


(2) 包 版 本 


工具 的 稳定 性 对 于 项 目 至 关 重要 ,合理 的 版 本 都 是 连续 迭代 的 ， 更 利于 项 目的 发 布 和 管理 。 在 实际 应 用 中 ， 可 能 会 出 现 : 版 本 号 1.0.1 是 1.0.0 的 一 次 小 更 新 ，1.1.0 可 能 新 增 了 一 些 新 功能 ， 而 在 版 本 号 
2.0.0 时 ， 软 件 也 许 已 经 和 1.0.0 版 本 大 为 不 同 。 


版 本 号 有 时 也 包含 包 的 稳定 性 信息 。 更 多 时 候 ， 版 本 1.8.5 会 比 2.0.0 要 更 加 稳定 ，2.0.0 会 比 1.8.5 有 更 新 的 功能 ， 但 是 为 了 稳定 性 ， 就 需要 指定 安装 1.*.* 的 最 新 版 本 ， 但 是 不 能 升级 到 2.0.0。 


为 了 满足 以 上 需求 ，Composer 在 用 户 在 进行 版 本 约束 时 ， 提 供 了 一 些 规范 和 对 应 表达 式 ， 见 表 6-1。 


表 6-1 Composer 版 本 约束 规范 和 对 应 表达 式 


确切 的 版 本 号 1.0:2 

i a i Ai >=1.0 >=1.0, 
Rd <2.0 >=1.0, 
全 <1.1|>=1.2 
通配符 1.0.* 
定义 最 小 版 本 运算 符 “2 
版 本 选择 运算 符 ^1.2 


表 中 符号 (~) 的 使 用 需要 重点 强调 ，~ 1.2 相 当 于 > =1.2<2.0.0， 而 ~1.2.3 相 当 了 


归 


本 号 


。 例 如 ，~1.2 定 义 了 最 小 的 小 版 本 号 ， 升 级 2.0 以 下 的 任何 版 本 都 不 会 出 问题 ， 


进行 升级 。 提 示 : 


因 


描 述 
指定 具体 的 版 本 号 
通过 使 用 比较 操作 符 可 以 指定 有 效 的 版 本 范围 。 开 发 者 可 
以 定义 多 个 范围 ， 用 浊 马 阳 开 ， 这 将 被 视 为 一 个 逻辑 AND 
处 理 。 一 个 管道 符号 骨 OR 处 理 。AND 的 优先 级 
高 于 OR 
使 用 通配符 * 来 指定 一 种 模式 。1.0.* 与 >=1.0,<1.1 是 等 效 的 
这 对 于 遵循 语义 化 版 本 号 的 项 目 非常 有 用 。~1.2 相 当 于 
>=1.2,<2.0 
获取 当前 版 本 的 稳定 版 本 (stable) 


> =1.2.3<1.3.0。 对 于 使 用 语义 化 版 本 号 (Semantic Versioning) 作为 版 本 号 标准 的 项 目 来 说 ， 这 种 版 本 约束 方式 很 


为 按照 版 本 定义 ， 小 版 本 的 升级 不 应 该 有 兼容 性 的 问题 。 简 单 来 说 ，~ 定 义 了 最 小 的 版 本 ， 并 且 人 允许 版 本 的 最 后 一 位 版 


想 要 了 解 关于 语义 化 版 本 号 (Semantic Versioning) 的 更 多 内 容 ， 可 以 访问 地 址 : http://semver.org/lang/zh-CN。 


(3) 开发 版 与 稳定 版 。 


除了 通过 表达 式 来 实现 版 本 约束 外 ， 还 可 以 指定 安装 包 的 版 本 是 开发 版 (dev) 还 是 稳定 版 stable) ， 例 如 默认 都 安装 稳定 版 (stable) ， 只 需要 在 composerjson 中 添加 以 下 配置 项 即 可 : 


"minimum-stability":"stable" 


2. 手 动 安装 第 三 方 包 


了 解 了 包 名 称 与 包 版 本 的 特性 后 ， 这 里 继续 介绍 Composer 的 其 他 操作 ， 了 解 如 何 手动 安装 依赖 包 。 


(1) 更 新 composer.json 文 件 


composer.json 文 件 格式 是 基于 JSON， 要 求 比较 严格 ， 在 手动 更 新 前 需要 注意 以 下 两 点 : 


: 只 支持 双 引号 作为 定义 字符 事 。 
“ 配置 项 最 后 一 个 不 能 有 “，” 符 号 。 


这 里 以 安装 PHPExcel 包 为 例 。 在 查找 到 需要 引入 的 包 名 称 后 ， 手 动 更 新 composer.json 文 件 内 容 如 下 : 


{ 

"require":{ 
"phpmailer/phpmailer":"^6.0", 
"phpoffice/phpexcel":"1.8.*" 

a 

"minimum-stability":"stable™ 
} 


(2) 执行 安装 命令 


执行 以 下 命令 : 


composer install 


完成 后 ， 可 以 看 到 Composer 安 装 了 版 本 号 为 1.8.1 的 PHPExcel 依 赖 包 ， 过 程 如 下 : 


Loading composer repositories with package information 
Updating dependencies (including require-dev) 
Package operations: 1 install, 0 updates, 0 removals 

=- Installing phpoffice/phpexcel (1.8.1): Downloading (100%) 
Writing lock file 
Generating autoload files 


3.composer.lock 文 件 


在 安装 依赖 后 ，Composer 将 把 安装 时 确切 的 版 本 号 列表 写 入 composer.lock 文 件 ， 这 将 锁定 该 项 目的 特定 版 本 。 


一 般 情 况 ， 需 要 提交 项 目的 composer.lock (包括 composerjson) 文件 到 版 本 库 中 。 因 为 执行 composer install 命 令 时 ， 会 自动 检查 锁 文 件 是 否 存 在 ， 如 果 存 在 ， 它 将 下 载 指 定 的 版 本 (忽略 
composerjson 文 件 中 的 定义 ， 如 更 新 的 版 本 号 等 ) 。 这 样 ， 当 任何 人 建立 项 目 时 ， 都 将 下 载 与 指定 版 本 (composer.lock 中 记录 的 版 本 号 ) 完全 相同 的 依赖 ， 以 避免 不 同 版 本 的 依赖 对 项 目 产生 的 各 种 影 
响 。 


若 需要 更 新 依赖 的 版 本 号 ， 可 以 使 用 以 下 命令 : 


composer update 


例如 ， 修 改 PHPExcel 的 版 本 号 为 1.7.*， 然 后 执行 Composer update 命 令 ， 执行 结 果 如 下 : 


Package operations: 0 installs, 1 update, 0 removals 
=- Updating phpoffice/phpexcel (1.8.1 => 1.7.9): Downloading (100%) 
Writing lock file 


执行 完毕 后 ， 查 看 composer.lock 文 件 中 的 版 本 号 已 经 发 生 了 变更 : 


"mame": "phpoffice/phpexcel", 
"version™:"].7.9", 


6.2.3 ”Composer 的 其 他 命令 操作 


开发 者 想 要 顺利 使 用 Composer， 是 离 不 开 命令 行 操作 的 。 在 这 里 先 总 结 前 面 几 个 实例 中 曾 使 用 过 的 Composer 命 令 ， 其 中 包含 了 包 的 搜索 、 安 装 和 声明 依赖 等 ， 见 表 6-2。 


表 6-2 曾 使 用 过 的 Composer 命 令 说 明 
命 令 | 功 能 说 明 
ee 搜索 search 命 令 人 允许 为 当前 项 目 搜索 依赖 包 ， 通 常 它 只 搜索 packagist.org 上 的 包 ， 
的 可 以 简单 地 输入 搜索 条 件 

require require 命 令 增加 新 的 依赖 包 到 当前 目录 的 composer.json 文 件 中 
install 命 令 从 当前 目录 读 取 composer.json 文 件 ， 处 理 了 依赖 关系 ， 并 把 其 安 

install 安装 装 到 vendor 目 录 下 。 先 在 composer.json 中 定义 需要 引入 的 依赖 关系 ， 再 执行 
此 命令 即 可 安装 
config 命 令 允 许 开发 者 编辑 Composer 的 一 些 基本 设置 ， 无 论 是 本 地 的 

config 配置 composer.json 或 者 全 局 的 config.json 文 件 。 该 命令 在 在 上 面 配置 中 国 全 量 镜 
像 的 实例 中 使 用 过 


以 上 这 些 命令 只 能 满足 日 常 开发 需求 ，Composer 还 提供 了 更 多 的 命令 以 实现 其 他 的 功能 ， 下 面 简单 讲解 其 他 常见 的 


她 
人 少 


1. 创 建 项 目 


与 使 用 require 命 令 在 已 有 项 目下 安装 依赖 不 同 ， 要 创建 基于 Composer 的 全 新 项 目 ， 可 以 使 用 create-project 命 令 。 只 需要 传递 一 个 包 名 ，Composer 会 自动 创建 项 目的 目录 ， 同 时 也 可 以 像 使 
require 命 令 一 样 指定 项 目 中 依赖 的 版 本 号 等 。 


create-project 命 令 有 如 下 几 个 常见 的 


“ 快速 地 部 署 应 用 。 


“ 可 以 检 出 任何 资源 包 ， 为 其 开发 补丁 包 。 


“ 多 人 开发 项 目 ， 可 以 用 它 来 加 快 应 用 的 初始 化 。 


如 果 该 目录 目前 不 存在 ， 则 会 在 安装 过 程 中 自动 创建 。 例 如 ， 以 “wangjialin/http” 这 个 依赖 为 例 ， 执 行 命令 创建 的 过 程 如 下 (注意 : 全 新 创建 的 项 目 名 为 httptest) 。 


$ composer create-project wangjialin/http httptest 

Installing wangjialin/http (v1.0.0) 

- Installing wangjialin/http (v1.0.0): Loading from cache 
Created project in httptest 

Loading composer repositories with package information 
Installing dependencies (including require-dev) from lock file 
Nothing to install or Update 

Generating autoload files 


此 时 查看 httptest 目 录 ，Compsoer 已 经 创建 了 对 应 的 文件 和 目录 ， 内 容 如 下 : 


Administrator@wangjialin-pc MINGW64 /d/phpStudy/www/httptest 
$ 11 


-- 1 Administrator 197108 428 10 月 16 14:56 composer.json 
1 Rdministrator 197108 568 10 月 16 14:56 composer.lock 
1 Rdministrator 197108 21 10 月 16 14:56 README .md 
drwxr-xr-x 1 Administrator 197108 0 10 月 16 14:56 src/ 
drwxr-xr-x 1 Administrator 197108 0 10 月 16 14:57 vendor/ 


需要 注意 的 是 ， 若 需要 定义 版 本 号 ， 则 在 自 定义 路 径 名 称 后 定义 即 可 。 


2. 依 赖 信息 查 看 


使 用 Composer 可 以 查看 任意 一 个 依赖 的 详细 信息 。 例 如 ， 查 看 当前 项 目 中 都 有 哪些 依赖 ， 可 以 执行 以 下 命令 : 


composer show 


执行 结果 如 下 : 


D: \phpStudy\WHW\demo6>composer show 
phpmailer/phpmailer v6.0.1 PHPMailer is a full-featured email creation and 
transfer class for PHP 


可 以 看 到 目前 项 目 中 ， 只 安装 了 PHPMailer 一 个 依赖 ， 查 看 PHPMailer 依 赖 的 详细 信息 ， 则 需 执行 以 下 命令 : 


composer show phpmailer/phpmailer 


执行 后 ， 可 以 看 到 此 包 的 详细 信息 ， 不 仅 包含 了 版 本 号 、 代 码 源 地 址 ， 执 行 结果 如 下 : 


D:NPhpStudyNWWWNdemo6>composer show phpmailer/phpmailer 


name : phpmailer/phpmailer # 包 名 

Gescrip. : PHPMailer is a full-featured email creation and transfer class 
for PHP 

keywords : # 关 键 字 

Versions : * v6.0.1 # 版 本 号 

type : library # 版 本 类 型 

license : GNU Lesser General Public License v2.1 only (LGPL-2.1) (OSI 
approved) https://spdx.org/licenses/LGPL-2.1.html#licenseText 

source : [git] https://github.com/PHPMailer/PHPMailer.git 992392437 
C2e2784e0dc41446024fe411d293c96 

dist : [zip] https://files.phpcomposer.com/files/PHPMailer/ 


PHPMailer/992392437c2e2784e0dc41446024fe4119293c96.zip 992392437 
C2e2784e0dc41446024fe411d2 

93c96 

names : Phpmailer/phpmailer 


autoload 
psr-4 
PHPMailer\PHPMailer\ => src/ # 自 动 加 载 映射 的 源码 类 库 


requires 
ext-ctype * 
php >=5.5.0 #PHP 版 本 依赖 


requires (dev) # 第 三 方 依赖 包 
doctrine/annotations 1.2.* 

friendsofphp/php-cs-fixer ^2.2 
Phpdocumentor/phpdocumentor 2.* 

Phpunit/phpunit “4.8 || ^5.7 
zendframework/zend-eventmanager 3.0.* 
zendframework/zend-il8n 2.7.3 
zendframework/zend-serializer 2.7.* 


suggests 

ext-mbstring Needed to send email in multibyte encoding charset 
hayageek/oauth2-yahoo Needed for Yahoo XOAUTH2 authentication 
league/oauth2-google Needed for Google XOAUTH2 authentication 

psr/log For optional PSR-3 debug logging 

stevenmaguire/oauth2-microsoft Needed for Microsoft XOAUTH2 authentication 
symfony/polyfill-mbstring To support UTF-8 if the Mbstring PHP extension 
is not enabled (^1.2) 


3. 依 赖 更 新 与 Composer 版 本 更 新 


当 需 要 获取 最 新 的 依赖 版 本 时 ， 可 以 使 用 以 下 命令 : 


composer update 


但 是 此 命令 会 更 新 当前 所 有 已 经 安装 的 依赖 ， 所 以 当 指 向 更 新 某 一 些 依赖 了 时， 只 需要 指定 依赖 的 包 名 即 可 : 


composer update phpmailer/phpmailer 


执行 以 上 命令 后 ， 当 发 现 有 更 高 版 本 时 ， 系 统 会 自动 更 新 指定 的 依赖 包 。 


除了 更 新 依赖 ， 还 可 以 更 新 Composer 的 工具 版 本 ， 只 需要 执行 以 下 命令 : 


composer self-update 


人 提示 : 在 Linux/Mac OS 系统 中 全 局 安装 的 Composer 工 具 ， 在 执行 更 新 命令 时 需要 在 root 权 限 下 执行 。 


6.3 ”提交 自 定义 包 到 Composer 


项 目 中 频繁 使 用 的 代码 片段 ， 通 常会 被 封装 成 全 局 的 方法 或 者 类 库 ， 以 提高 程序 的 复 用 性 ， 但 初始 化 新 项 目 ， 手 动 引入 会 相对 麻烦 ， 此 时 就 可 以 提交 到 Composer 上 实现 自动 安装 。 


本 节 将 讲解 如 何 把 自 定义 的 类 库 提交 到 Composer 的 Packagist 中 去 ， 最 终 实现 一 键 安装 自 定义 的 类 库 依赖 ， 从 而 简化 项 目 开发 流程 。 


6.3.1 本 地 创建 Composer 包 


因为 Composer 的 代码 都 是 托管 在 GitHub 上 的 ， 所 以 开发 者 需要 对 Git 的 操作 比较 熟悉 ， 并 且 Composer 本 身 对 类 库 的 提交 也 有 一 些 辅助 性 的 工 : 


个 步骤 : 
“ 在 GitHub 上 创建 应 用 仓库 。 
“使 用 Composer 在 本 地 初始 化 。 
“ 在 本 地 开发 类 库 ， 并 与 Composer 建 立 对 应 关系 。 
“ 提交 到 GitHub 应 用 仓库 。 


: 提交 GitHub 仓 库 地 址 到 Packagist 后 完成 发 布 。 


对 应 的 流程 图 妇 


一 


图 6-8 所 示 。 


， 可 以 减少 开发 者 出 错 的 几率 。 操 作 过 程 主要 有 以 下 几 


GitHub 建 立 推送 到 获取 Git 发 布 


开始 项 目 仓库 并 


克隆 到 本 地 


| 初始 化 composerjson 文 件 国 提交 到 


| | 
Composer 


| 癌 


GitHub 仓 库 
(dev 测 试 版 


司 6-8 ”在 Packagist 上 发 布 自 定义 Composer 的 包 


1. 在 GitHub 创 建仓 库 并 克隆 到 本 地 

在 GitHub 上 创建 一 个 空仓 库 ， 命 名 为 http， 仓 库 的 基础 信息 如 下 : 
:名称 为 wangjialinbeijing/http。 

“ 地 址 为 https://github.com/wangjialinbeijing/http.git。 


完成 以 上 操作 后 ， 克 隆 线 上 仓库 的 副本 到 本 地 ， 作 为 类 库 开发 的 基础 目录 。Git 的 操作 步骤 在 第 3 章 有 详细 的 介绍 ， 这 里 就 不 再 歼 述 。 


GitHub 项 目地 址 稳定 版 本 


Packagist 


(stable 稳 定 版 》 


2. 初 始 化 composerjson 文 件 


创建 本 地 包 的 第 一 步 就 是 初始 化 composerjson 文 件 。 为 了 方便 演示 ， 本 实例 的 本 地 仓库 地 址 为 D: \phpStudy\WWW\http， 在 此 目录 下 执行 以 下 命令 ， 完 成 配置 文件 的 初始 化 : 


composer init 


命令 执行 后 会 有 引导 步骤 ， 一 步 步 填写 包 的 基本 信息 ， 如 包 名 称 、 包 描述 和 包 类 型 等 ， 完 整 的 操作 记录 和 注释 说 明 如 下 : 


$ So init 


提示 
# 包 名 ， 格 式 为 ， 供 应 商 / 包 名 ， 此 格式 确定 包 名 的 唯一 性 
Package name (<vendor>/<name>) [administrator/http]: wangjialin/http 
# 包 描述 ， 可 以 不 填 ， 按 回 车 键 略 过 
Description []: CURL HTTP 
# GitHub 用 户 名 与 邮箱 
Author [ 王 甲 临 <wangjialin.bj@gmail.com>, n to skip]: wangjialinbeijing 
人 站 ialin.bjegmail.com> 
布 的 最 低 要 求 ， 填 写 dev 可 以 让 GitHub 上 的 代码 直接 同步 到 Packagist， 填 写 stable 
各 入 全 要 
Minimum Stability []: stable 
# 包 类 型 ， 默 认 选 择 library 妈 可， 其 他 还 有 项 目 、 插 件 等 类 型 
Package Type (e.g. library, project, metapackage, composer-plugin) []: 
librar. 
# 授权 类 型 ， 可 以 不 填 ， 按 回 车 键 略 过 
License [] : MIT 
Define your dependencies. 
# 是 否定 义 当 前 的 依赖 项 ， 可 以 输入 no 后 按 回 车 键 略 过 


Would you like to define your dependencies (require) interactively [yes]? 


Yes 
# 选择 搜索 依赖 的 包 ， PS 
Search for a package: 
# 输入 最 低 版 本 约束 ， pgps. 3 
Enter the 于 constraint to require (or leave blank to use the latest 
Ps >=5. 
nk, 此 时 没有 ， 可 以 略 过 
se for a package: 
Would you like to define your dev dependencies (require-dev) interactively 
[yes]? 
Search for a package: 
# composer.json 文 件 预览 
{ 


"name": "wangjialin/http", 
"description": "CURL HTTP", 
"type": "library", 
"require": { 
"php": "5.3" 
] 
"license": "MIT'" 
"authors": [ 
{ 
"name": "wangjialinbeijing", 
"email": "wangjialin.bj@gmail .com" 
i 
]， 
"minimum-stability": "stable" 


最 后 确认 是 否 创 建 composer.json 文 件 
各 ou confirm generation [yes]? Yes 
是 否 将 vendor 类 库 目录 加 入 到 Git 的 忽略 列表 中 ， 这 个 根据 实际 需要 选择 
ri you like the vendor directory added to your .gitignore [yes]? yes 
随后 查看 http 目 录 结 构 ， 发 现 composer .json 文 件 已 经 经 创建 成 功 ， 如 下 : 
$s 11 
total 2 
-rw-r--r-- 1 Administrator 197108 323 10 月 13 14:36 composer.json 
—rw-r--r-- 1 Administrator 197108 23 10 月 13 14:28 README.md 


自动 生成 的 composerjson 文 件 选择 项 比较 少 ， 开 发 者 可 以 继续 手动 修改 或 者 追加 配置 项 。 为 了 后 面 方便 把 类 库 地 址 和 Composer 的 自动 加 载 对 应 ， 还 可 以 手动 配置 相应 内 容 ， 如 映射 类 库 的 命名 空间 
的 实际 目录 : 


"autoload": { 
"psr-4": { 
"wangjialin\\http\\": "src/http/lib" 
} 


命名 空间 的 定义 不 一 定 要 和 文件 夹 目录 完全 一 致 ， 可 根据 需求 自 定义 。 


3 .编写 包 核心 类 库 


这 一 部 分 就 是 编写 自 定义 的 类 库 了 ， 注意 命名 空间 的 定义 。 为 了 简化 演示 ， 实 例 对 PHP 内 置 的 字符 串 读 取 file_get_contents () 方法 进行 二 次 封装 ， 实 现 简易 的 HTTP 请 求 (GET) 操作 方法 。 


在 http 目 录 下 ,创建 路 径 为 src/http/lib/Http.php 的 脚本 文件 ， 核 心 代码 如 下 : 


<?php 
namespace wangjialin\http; 


/** 
* HTTP 请 求 操作 类 
* Class Http 
* @package wangjialin\http 
A 
class Http 
{ 
太太 
* GET 请 求 类 
* @param $url 
* @return bool|string 
Public static function requestByGet ($url) 
return file get contents ($url); 
’ 
} 


实现 GET 请 求 的 方法 为 requestByGet () ， 参 数 为 URL， 访 问 成 功 则 会 返回 响应 值 (字符 串 ) ， 否 则 返回 false。 


4. 建 立 类 库 与 Composer 关 系 


完成 类 库 文件 的 编写 后 ， 还 需要 建立 与 Composer 的 关系 ， 主 要 操作 就 是 把 自 定义 类 库 ， 加 入 到 Compsoer 的 自动 加 载 (autoload) 机 制 中 去 。 在 类 库 提交 后 ， 开 发 者 只 需要 在 项 目 中 引入 全 局 的 
autoload.php 文 件 (vendor/autoload) ， 就 可 以 直接 实例 化 和 使 用 类 库 相关 功能 。 


可 


在 具体 操作 上 ， 先 执行 以 下 命令 : 


composer install 


完成 后 ，Composer 会 自动 生成 命名 空间 之 间 的 映射 关系 ， 执 行 后 会 在 项 目 目录 下 自动 生成 vendor 目 录 ， 并 在 vendor 目 录 下 生成 composer 包 自动 加 载 (autoload) 程序 文件 : 


D:NphpStudyNWWWNhttpP>composer install 

Loading composer repositories with package information 
Updating dependencies (including require-dev) 

Nothing to install or update 

Writing lock file 

Generating autoload files 


在 项 目 根 目录 下 的 verndor/composer/autoload_psr4.php 文 件 中 ， 记 录 了 $vendorDir 和 $baseDir 的 路 径 。 使 用 Composer 安 装 类 库 依赖 时 ，Packagist 会 自动 将 自 定义 的 项 目 文件 放 到 vendor 目 录 
在 Composer 中 的 实现 代码 如 下 : 


<?php 
// autoload psr4.php @generated by Composer 
$vendorDir = dirname (dirname(_ FILE )); 
$baseDir = dirname ($vendorDir); 
return array( 
'wangjialin\\http\\' => array ($baseDir . '/src/http/lib'), 


也 


5. 本 地 测试 包 是 否 可 用 


在 正式 提交 GitHub 之 前 ， 需 要 在 本 地 测试 通过 ， 查 看 类 库 是 否 可 以 正常 使 用 。 在 项 目 根 目录 下 新 增 index.php 文 件 ， 内 容 如 下 : 


<?php 

// 全 局 自动 加 载 

require DIR  . '/vendor/autoload.php'; 

// 调用 类 方法， 打印 返回 值 字符 串 的 长 度 

var_dump (strlen (wangjialin\http\Http: :requestByGet ('http://github. 
com'))); 


在 浏览 器 中 访问 index.php 文 件 ， 输 出 如 下 结果 则 说 明 类 库 功 能 调试 成 功 : 


D:NPhpStudyNWWWNhttp\index.php:11:int 50680 # 展 示 响 应 字符 串 的 长 度 


6.3.2 ”提交 依赖 包 到 Composer Packagist 


本 地 类 库 开发 完毕 后 ， 需 要 分 几 步 操作 上 线 到 Composer 的 Packagist 中 去 ， 下 面 讲解 相关 的 步骤 。 
1. 推 送 本 地 代码 到 GitHub 

推送 本 地 代码 到 线 上 仓库 的 操作 ， 这 里 不 再 歼 述 。 

2. 提 交 到 Packagist 

提交 自己 的 Composer 包 到 Packagist， 主 要 有 以 下 几 个 步骤 。 


(1) 注册 Packagist 账 号 并 登录 


访问 地 址 : https://packagist.org/register， 实 现 注 册 和 登录 操作 ， 不 过 也 可 以 使 用 第 三 方 ， 如 GitHub 账 号 实现 授权 登录 ， 简 化 注册 流程 。 


(2) 提交 包 的 GitHub 仓 库 地 址 


访问 地 址 : https://packagist.org/packages/submit， 在 Repository URL (Git/Svn/Hg) 下 方 的 输入 框 中 ,填写 Git 地 址 后 单 击 Check 按 钮 ， 如 图 6-9 所 示 。 


Packagist 会 检测 包 是 否 和 已 有 应 用 重 名 ,没有 重 名 就 可 以 继续 提交 ， 结 果 如 图 6-10 所 示 。 


Submit package 


Repository URL (Git/Svn/Hg) 


https://github.com/wangjialinbeijing/http.git 


Check 


图 6-9 填写 包 源 码 托管 的 GitHub 地 址 


Supbmit package 


Repository URL (Git/Svn/Hg) 


https://github.com/wangjialinbeijing/http.git 


Notice: One or more similarly named packages have already been submitted to 
Packagist, If this is a fork read the notice above regarding VCS Repositories， 


Similarly named packages: 


aura/http 
react/http 
guzzle/http 
sabre/http 
illuminate/http 
And 265 more 


The package name found for your repository is: wangjialin/http, press Submit to 
confirm. 


Submit 


图 6-10 ”检测 成 功 后 进行 提交 操作 


提交 成 功 后 ,效果 如 图 6-11 所 示 。 


也 composer require wangjialin/http 


This package is not auto-updated. Please set up the GitHub Service Hook for Packagist so that it gets updated 
whenever you push! 


OO 


图 6-11 成 功 提交 后 查看 依赖 包 的 详情 
3. 发 布 正式 版 本 
当 Composer 获 取 测 试 版 本 (dev) 进行 依赖 包 安装 时 ， 会 自动 同步 GitHub 上 最 新 的 代码 ， 但 稳定 版 (stable) 的 发 布 需要 在 GitHub 上 添加 相应 的 标签 (Tag) 。 下 面 简 单 讲解 操作 步骤 。 
(1) 本 地 创建 Tag 并 推送 到 版 本 库 


执行 以 下 命令 创建 Tag : 


git tag -a v1.0.0 -m="'v1.0.0' 


执行 相应 命令 查看 Tag 是 否 已 添加 ， 显 示 如 下 结果 说 明 Tag 已 经 添加 成 功 : 


$ git tag 
V1.0.0 


执行 命令 推送 Tag 到 GitHub， 相 应 执行 效果 如 下 : 


$ git push origin --tags 

Counting objects: 1, done. 

Writing objects: 100% (1/1), 164 bytes | 0 bytes/s, done. 
Total 1 (delta 0), reused 0 (delta 0) 

To https://github.com/wangjialinbeijing/http.git 

* [new tag] v1.0.0 -> v1.0.0 


(2) 更 新 Packagist 


访问 地 址 : https://packagist.org/packages/wangjialin/http， 单 击 Update 按 钮 可 以 更 新 包 的 版 本 ， 如 图 6-12 所 示 。 


页 面 刷 新 后 ， 发 现 版 本 已 经 更 新 ， 结 果 如 图 6-13 所 示 。 


CURL HTIP 


图 6-12 ”执行 更 新 包 版 本 操作 


dev-master 


图 6-13 更 新 后 的 包 版 本 


4 安装 使 用 


为 了 测试 使 用 ， 在 demo6 项 目 中 使 用 require 声 明 依赖 ， 执 行 命令 如 下 : 


composer require wangjialin/http 


执行 结果 如 下 ， 则 说 明 自 定义 的 依赖 已 经 可 以 正常 安装 。 


Administrator@wangjialin-pc MINGW64 /d/phpStudy/www/demo6 
$ composer require wangjialin/http 
Using version ^1.0 for wangjialin/http 
./composer.json has been updated 
Loading composer repositories with package information 
Updating dependencies (including require-dev) 
Package operations: 1 install, 0 updates, 0 removals 
- Installing wangjialin/http (vi.0.0): Loading from cache 
Writing lock file 
Generating autoload files 


在 index.php 脚 本 文件 中 ， 注 释 PHPMailer 类 打印 的 代码 ， 并 增加 以 下 代码 : 


// 在 浏览 器 中 打印 实例 结构 

//var dump ($mailer); 

// 使 用 http 类 的 请 求 方法 ,查看 返回 字符 串 长 度 

var_dump (strlen (wangjialin\http\Http: :requestBYGet ('http://github.com'))); 


执行 结果 如 下 ， 则 说 明 依 赖 工具 已 经 可 以 正常 使 用 。 


项 目 入 口 文件 
D:NPphpStudyNWWWNdemo6N\index.php:12:int 49664 


“ 第 7 章 ”响应 式 布局 框架 


Bootstrap 


“ 第 8 章 ThinkPHP 命 令 行 操作 与 接口 开发 实战 


第 7 章 ”响应 式 布局 框架 一 一 Bootstrap 


随 着 移动 设备 的 广泛 使 用 ， 越 来 越 多 的 用 户 开始 使 用 手机 或 平板 电脑 浏览 网 页 。 而 针对 PC 编写 的 网 页 ， 若 不 对 这 些 设备 进行 适 配 ， 则 无 法 满足 正常 的 用 户 使 用 体验 。 传 统 的 移动 页 面 适 配 ， 都 是 采取 移 
动 端 、PC 端 页 面 各 自 开发 的 方式 ， 不 仅 费 时 、 费 力 ， 后 期 维护 的 成 本 也 非常 巨大 。 


加 


那么 是 否 有 办 法 解决 这 类 问题 呢 ? 基 于 响应 式 布局 的 前 端 框 架 ， 就 可 以 满足 这 类 需求 。 基 于 框架 技术 ， 开 发 者 通常 只 需要 编写 一 套 代码 ， 框 架 就 可 以 根据 设备 自动 适 配 。 本 章 将 通过 介绍 响应 式 布局 框 
架 一 一 Booststap， 让 开发 者 快速 掌握 前 端 开发 技巧 。 


7.2 Boostrap 实 战 技巧 


本 节 不 再 罗列 Bootstrap 的 详细 组 件 样式 ， 只 讲解 在 学 习 此 类 框架 时 ， 开 发 者 需要 注意 的 重点 和 技巧 ， 这 样 读 者 遇 到 同类 框架 时 ， 学 习 过 程 会 更 高 效 。 


7.2.1 布局 容器 与 栅 格 系统 


实现 各 式 各 样 的 页 面 布局 ， 开 发 者 需要 结合 盒 模型 、 内 外 边 距 和 div 容 器 等 各 种 方式 ， 在 满足 需求 的 同时 ， 编 写 大 量 的 业务 代码 ， 这 不 仅 耗费 时 间 ， 还 会 因为 多 终端 、 跨 浏览 器 等 问题 ， 导 致 开发 效率 低 
下 。Bootstrap 框 架 内 置 了 布局 容器 与 栅 格 系统 ， 开 发 者 只 需 像 搭 积木 一 样 ， 用 最 少 的 代码 最 快 实现 效果 。 


Bootstrap 的 安装 与 基础 使 用 在 这 里 不 再 歼 述 ， 这 里 直接 介绍 Bootstrap 的 布局 容器 与 栅 格 系统 的 原理 。 


1. 布 局 容器 


Bootstrap 框 架 提供 了 两 个 预定 义 样式 来 实现 最 外 层 的 包 庄 效果 。 


(1) 固定 布局 容器 


使 用 预定 义 的 样式 “.container” 结 合 div 元 素 ， 可 以 实现 一 个 固定 宽度 并 且 支 持 响应 式 布局 的 容器 ， 实 例 代 码 如 下 : 


<div class="container"> 


</div> 


(2) 全 窗口 布局 容器 


使 用 预定 义 的 样式 “.container-fluid” 结 合 div 元 素 ， 容 器 宽度 为 100%， 实 现 窗口 的 布局 容器 。 容 器 可 以 根据 页 面 的 宽度 自 适 应 ， 以 保证 全 部 覆盖 显示 : 


<div class="container-fluid"> 


| </div> 


2. 栅 格 系统 


Bootstrap 提 供 了 一 套 响应 式 、 移 动 设备 优先 的 流 式 栅 格 系统 ， 随 着 屏幕 或 浏览 器 窗口 尺寸 的 增加 ， 系 统 会 自动 分 为 最 多 12 列 。 而 布局 都 是 通过 预定 义 的 样式 类 来 操作 ， 开 发 者 可 以 组 合 出 所 需 的 布局 
方式 。 


一 个 典型 的 栅 格 布局 结构 ， 如 图 7-6 所 示 。 


三 层 关 系 : 最 外 层 的 
容器 为 Container， 行 
使 用 Row 定义 > 用 U 
(单元 格 ) 使 用 Cols 
定义 


Container 


Cols 单 元 格 的 数量 介 于 1 
到 12 之 间 ， 满 足 大 部 
分 的 布局 需求 


图 7-6 ”Bootstrap 典 型 的 栅 格 系统 


栅 格 系统 有 点 类 似 表格 布局 ， 但 可 以 实现 的 功能 更 强大 。 使 用 栅 格 布局 需要 注意 以 下 几 点 : 


* 预定 义 样 式 container/containetr-fluid 外 层 布局 样式 。 


“ 行 (row) 定义 布局 的 上 下 层级 关系 ， 可 以 理解 为 表格 table 元 素 中 的 tt 元 素 。 


“ 列 (cols) 定义 容器 在 行 (tow) 内 的 布局 关系 ， 可 以 理解 为 tt 元 素 中 的 td 单元 格 元 素 。 


“ 行 (tow) 没有 数量 限制 ， 列 (cols) 最 少 1 个 ， 最 多 12 个 。 


了 解 栅 格 系统 的 定义 后 ， 在 实际 使 用 前 还 需要 掌握 Bootstrap 提 供 的 预定 义 类 ， 才 能 知道 如 何 定义 行 (row) 、 列 (cols) 和 实现 响应 式 布 局 等 操作 。 根 据 显示 设备 宽度 不 同 ， 搭 配 不 同 的 行 (cols) 预 
定义 样式 可 以 实现 不 同 的 响应 式 布局 效果 ， 指 定 布局 在 什么 宽度 下 进行 自动 变化 。 各 个 预定 义 类 对 应 的 宽度 如 表 7-1 所 示 。 


表 7-1 Bootstrap 栅 格 系统 响应 式 布局 预定 义 样式 类 


平板 屏幕 PC 屏幕 超大 屏幕 


样式 属性 说 明 (>=768px) (>=992px) (>=1200px) 
ey 玲 营 排列 ， 超 过 六 | 开关 排列， 超过 网 | 堆 基 排列 ， 超 过 商 
| 值 后 水 平 排列 | 值 后 水 平 排列 | 值 后 水 平 排列 


容器 最 大 宽度 1170px 

类 前 级 col-lg- 

最 大 列 数 量 12 12 

最 大 列 宽度 97px 左 右 

列 间距 宽度 30px( 左右 各 15px) 


为 了 更 好 地 理解 ， 下 面 通过 模拟 实际 需求 编写 一 个 实例 。 某 产品 的 首页 列表 需 专 门 对 平板 模式 和 PC 模式 进行 适 配 。PC 模 式 布 局 设计 如 图 7-7 所 示 ， 一 行 显示 4 个 元 素 。 


在 PC 浏览 器 上 显示 -每 行 显示 4 个 布局 元 素 ， 共 显示 1 行 


Container 容 器 


图 7-7 模拟 PC 模式 下 显示 响应 式 布局 结构 


在 平板 模式 下 则 自动 变化 为 一 行 显示 2 个 元 素 ， 原 有 的 4 个 元 素 分 为 两 行 展示 ， 如 图 7-8 所 示 。 


| 在 平板 浏览 器 上 显示 -每 行 显示 2 个 布局 元 素 ， 共 显示 2 行 


Container 容 器 


图 7-8 模拟 平板 模式 下 显示 响应 式 布局 结果 图 


部 分 代码 实现 如 下 : 


<div class="container"> 

<div class="row"> 

<div class="col-md-12"> 
<h1>PC/ 平 板 响应 式 布局 展示 </h1> 

</div> 

</div> 

<div class="row layout"> 
<div class="col-md-3 col-sm-6">: 
<div class="col-md-3 col-sm-6">: 


部 分 </div> 
部 分 </div> 


<div class="col-md-3 col-sm-6 部 分 </div> 
<div class="col-md-3 col-sm-6"> 第 四 部 分 </div> 
</div> 


</div> 


在 PC 模式 和 平板 模式 下 分 别 访问 同一 页 面 ， 效 果 如 图 7-9 所 示 。 


PC/ 平 板 响 应 式 布局 展示 


第 一 部 分 第 二 部 分 第 三 部 分 第 四 部 分 


PC/ 平 板 响 应 式 布局 展示 


第 一 部 分 第 一 部 分 
第 三 部 分 第 四 部 分 


图 7.9 不 同 设备 上 的 响应 式 布局 效果 
人 提示 : 开发 者 可 以 自行 尝试 ， 在 手机 页 面 布局 条 件 下 ， 林 实例 的 展示 效果 。 
7.2.2 ”Bootstrap 组 件 快速 入 门 技巧 


Bootstrap 框 架 自 带 的 基础 样式 和 预定 义 样式 组 件 十 分 丰富 ， 短 时 间 内 难以 全 部 熟悉 ， 不 过 这 里 提供 一 些 使 用 上 的 技巧 ， 不 仅 可 以 帮助 读者 快速 入 门 ， 还 可 以 提升 学 习 的 效率 。 


1. 掌 握 预定 义 样式 规律 


布局 与 展示 类 效果 都 是 由 预定 义 的 CSS 样 式 统一 实现 ， 通 过 观察 可 以 发 现 一 定 的 规律 。 以 按钮 样式 为 例 ， 定 义 一 个 默认 样式 的 按钮 ， 代 码 通 常 如 下 : 


<a class='btn btn-default' href='#'> 这 是 一 个 普通 按钮 </a> 


而 定义 一 个 成 功 样式 的 按钮 时 代码 如 下 : 


<a class='btn btn-success' href='#'> 这 是 一 个 成 功 样式 按钮 </a> 


在 此 基础 上 ， 再 对 按钮 的 大 小 进行 调整 ， 比 如 加 大 成 功 样式 按钮 的 大 小 ， 只 需要 继续 追加 预定 义 的 样式 : 


<a class='btn btn-success' href='#'> 这 是 一 个 成 功 样式 的 大 按钮 </a> 


通过 以 上 按钮 的 定义 ， 发 现 Bootstrap 的 样式 定义 具有 包含 关系 : 
“样式 类 btn 是 按钮 的 基础 样式 。 
. 样式 类 btn-default 是 按钮 的 展示 类 型 样式 。 


. 样式 类 btn-lg 是 按钮 的 大 小 类 型 样式 。 


上 面 几 种 样式 中 ， 除 了 基础 样式 必须 定义 外 ， 其 他 几 个 样式 完全 可 以 根据 需求 灵活 组 合 ， 实 现 需 要 的 效果 。 


不 仅 是 按钮 的 预定 义 样式 规律 如 此 ， 其 他 的 基础 样式 也 大 多 如 此 。 例 如 ， 表 格 相关 的 样式 ， 也 拥有 一 个 基本 的 table 样 式 ， 其 他 效果 可 在 基础 样式 上 继续 追加 。 


例如 ， 需 要 一 个 带 边框 的 表格 ， 代 码 如 下 : 


<table class="table table-bordered"> 


</table> 


2. 借 助 开发 工具 自动 提示 


除了 通过 官方 手册 查询 Bootstrap 都 有 哪些 预定 义 样式 外 ， 还 可 以 借助 开发 工具 的 自动 提示 功能 进行 联想 提示 。 因 为 在 Bootstrap 中 ， 样 式 一 般 都 是 按照 功能 性 来 定义 ， 如 成 功 样式 的 按钮 btn- 
success、 带 边框 的 表格 table-bordered， 开 发 者 在 见 到 这 些 样式 定义 的 时 候 ， 基 本 上 可 以 猜 到 对 应 的 效果 。 


这 里 以 PHPStorm 开 发 工具 为 例 ， 展 示 自动 提示 所 带 来 的 便捷 性 。 


(1) 创建 一 个 auto.html 页 面 ， 引 入 Bootstrap 框 架 ， 增 加 一 个 table 元 素 ， 定 义 class 属 性 时 会 自动 提示 关联 样式 ， 如 图 7-10 所 示 。 


<div class="row"> 
<div class="col-md-12"> 
<table class="table"></table> 
</div> 四 table ZcessN\bDootstrap min eos 
</div> 四 table-bordered 7.2.1\css\bootstrap.min.css: 


pp 加 table-responsive 7.2.1\css\bootstrap.min.css: 


Press Ctrl+ad to choose the selected (or first) suggestion and insert a dot afterwards >> 


图 7-10 ”使 用 [DE 快速 查找 预定 义 样式 一 一 表格 相关 样式 


(2) 在 页 面 上 定义 一 个 超 链接 ， 定 义 class 属 性 上 时， 自动 提示 关联 样式 ， 如 图 7-11 所 示 。 


和 提示: 自动 提示 可 行 的 前 提 条 件 是 Bootstrap 及 其 相关 的 CSS、JavaSctipt 类 库 文件 必须 在 本 地 引入 。 


<div class="col-md-12"> 

<a class="btn btn-" 

<table class 四 bnabloek RNTNCSSNDOoESEFaDSnInESECSS 
btn-danger .2.1\css\bootstrap.mi 
加 btn-default ZeNGSSNDOOESEPapR 
回 btn-group 7.2.1\css\bootstrap.min 
| 图 btn-group-justified 7.2.1\css\ 人 
四 btn-group-】g INCSSNDbootcstFcapaman 


ript src="WeaeeseNeeln btn-gro 


DuUp-sm .1\css\bo re ey Cs 


7 
btn-group-vertical 7.2.1\css\bootstrap.min.c 
ript src="js/bootstra@btn-group-xs ps i 
四 btn-info 2 ss\bootstrap.min.css:5 


SD 1 i\V--e A mi 
Press Ctrl+ 四 to choose the selected (or first) suggestion and insert a dot afterwards >> 


图 7-11 使 用 IDE 快 速 查找 预定 义 样式 一 一 按钮 相关 样式 


7.3 ”基于 Bootstrap 的 后 台 模板 样式 一 一 AdminLTE 


里 然 Bootstrap 本 身 拥有 诸多 优势 ， 但 它 是 一 个 通用 的 前 端 框 架 ， 未 对 特殊 需求 进行 定制 。 例 如 ， 开 发 管理 后 台 相 关 页 面 ， 使 
也 是 不 小 的 工作 量 。 本 节 重 点 讲解 基于 Bootstrap 的 后 台 模 板 样式 AdminLTE， 掌 握 如 何 快速 开发 后 台 样式 。 


Bootstrap 框 架 就 要 从 头 写 起 ， 昌 然 各 个 组 件 都 提供 了 ， 但 是 整合 到 一 起 


7.3.1 _ AdminLTE 简 介 与 安装 


开发 者 实现 完整 的 后 台 管理 界面 ， 需 要 编写 大 量 的 样式 代码 。 为 了 减少 工作 量 ， 此 时 可 以 选择 开源 的 后 台 模 板 样式 一 一 AdminLTE。 


1. 简 介 


AdminLTE 是 一 套 基于 Bootstrap 框 架 的 后 台 模 板 样 式 ， 不 仅 提 供 了 登录 注册 、 用 户 中 心 、 表 单 表格 和 页 面 提示 等 常用 模板 样式 组 件 ， 还 提供 了 像 动 态 导航 、 下 拉 菜 单 和 表格 无 刷新 排序 等 JjavaScript 组 
件 ,方便 用 户 直接 调用 。 


AdminLTE 拥 有 完整 的 Bootstrap 框 架 特性 ， 对 于 了 解 Bootstrap 框 架 的 开发 者 来 说 ， 基 本 上 都 可 以 快速 入 门 。AdminLTE 的 整体 样式 风格 如 图 7-12 所 示 。 


AdminLTE 


(9 Alexander Pierce 
《 Online 


Dashboard 


© Dashboardv2 


通过 图 7-12 可 以 看 出 ，AdminLTE 的 布局 风格 是 典型 的 管理 后 台 样 式 ， 模 板 不 仅 基 于 Bootstrap 的 栅 格 布局 ， 可 以 自动 适 配 移动 端 ， 还 提供 了 大 量 的 预定 义 组 件 样式 ， 如 单独 的 用 


网 
六 


各 
可 


Dashboard vsrsion2n 


CPU TRAFFIC 


7 > 


Monthly Recap Report 


Sales: 1 Jan, 2014 - 30 Jul, 2014 


January February March 


217% 
$35,210.43 
TOTAL REVENUE 


Visitors Report 


Invoice 


堪 Home -> 


i Note: 


From 


40: 


$10,390.90 
TOTAL COST 


AdminLTE 


A 


HUU /OlZ 


Examples > Invoice 


3 AdminLTE, Inc. 


a 20% 
$24,813.53 
TOTAL PROFIT 


This page has been enhanced for printing. Click the 
print button at the bottom of the invoice to test. 


Date: 2/10/2014 


fay [= [全] Alexander Pierce be 


多 Home 


NEW MEMBERS 
2,000 


Goal Completion 
Add Products to Cart 


Complete Purchase 
Visit Premium Page 
Send Inquiries 
18% 


1200 
GOAL COMPLETIONS 


INVENTORY 
5,200 


509% Increase in 30 Days 


Admin, Inc, 

795 Folsom Ave, Suite 600 

San Francisco, CA 94107 

Phone: (804) 123-5432 

Email: info@almasaeedstudio.com 


b) 


图 7-12 AdminLTE 提 供 了 丰富 的 响应 式样 式 风格 


航 布 局 和 丰富 的 菜单 等 ， 可 以 满足 大 部 分 的 后 台 管理 样式 需求 。 


不 过 一 般 的 后 台 管理 页 面 并 不 需 


这 么 多 功能 导航 、 菜 单 和 主体 页 面 (包含 列 表 、 表 单 等 ) 即 可 满足 需求 。AdminLTE 主 体 布局 结构 


如 


7-13 所 示 。 


Dashboard 


息 展示 、 各 类 统计 


http://www.wangjialin.com 


i 


主体 内 容 展示 区 域 


标签 1 


全 局 菜单 展示 


图 7-13 AdminLTE 主 体 布局 结构 图 


导航 和 菜单 ， 可 以 直接 使 用 AdminLTE 的 样式 。 同 样 ， 在 实际 项 目 开发 中 ， 主 体内 容 最 常用 的 就 是 表单 和 列表 样式 ， 在 AdminLTE 中 表单 和 列表 如 图 7-14 所 示 。 


General Form Elements wrevew Simple Tables preview ofsimpletables 
uick Example 
Bp Bordered Table 
Emailaddress 
Enter email # Task Progress Label 
Te 1. Update software CR E3 
Password 
2. Clean database 一 全 [70% 】 
File input 
选择 文件 | 未 选择 任何 文件 3. Cron job running 【30% 】 
Example block-level help text here. 
4. Fixand squish bugs 人 


Check me out 


图 7-14 AdminLTE 中 的 表单 和 列表 
全 提示 : AdminLTE 中 包含 了 大 量 的 基础 样式 与 组 件 ， 想 了 解 更 多 内 容 可 以 参考 官方 手册 和 模板 源 代 码 。 
2. 框 架 安装 


访问 地 址 https://github.com/almasaeed2010/AdminLTE/releases， 可 以 直接 下 载 AdminLTE 的 源码 。 根 据 需 要 选择 最 新 的 版 本 (本 实例 使 用 AdminLTE 2.4.2 版 本 ) 下 载 ， 如 图 7-15 所 示 。 


Latest release AdminLTE 2.4.2 


© v2.4.2 
-O- 156f56c 


因 almasaeed2010 released this on 10 Oct .13 commits to master since this release 


Release Notes 


e。 156f56c Fix background color 


Downloads 


(DD Source code (zip) 


图 Source code (tar.gz) 


7-15 获取 最 新 的 AdminLTE 源 代码 


下 载 成 功 后 ， 解 压缩 源 代码 到 本 地 ， 为 了 方便 演示 ， 这 里 修改 解压 完成 的 框架 源码 目录 名 为 admin7， 作 为 后 面 几 节 演示 的 实例 项 目 。 


通过 admin7 目 录 ， 查 看 AdminLTE 源 代码 ， 发 现 内 容 较 多 ， 如 图 7-16 所 示 。 


bower components 


build 
dist 


documentation 


pages 
plugins 


图 7-16 ”AdminLTE 框 架 部 分 目录 结构 


对 几 个 重要 的 目录 和 文件 说 明 如 下 。 


“dist; AdminLTE 模 板 的 JavaScript、CSS 和 字体 文件 的 存储 目录 。 
: documentation: 各 个 组 件 的 说 明文 档 。 

“ pages: 各 种 实例 的 实际 存放 地 址 。 

“ plugins: 第 三 方 JavaScript 插 件 的 实际 存放 地 址 。 

starter.html; 快速 开始 使 用 模板 文件 。 


“ index.html: 官方 实例 展示 入 口 文件 。 


人 提示 : 本 章 中 的 AdminLTE 实 例 ， 不 依赖 PHP 的 运行 环境 ， 可 以 直接 在 操作 系统 文件 目录 下 访问 执行 。 


7.3.2， 布局、 皮肤 与 box 容 器 


无 论 学 习 哪 个 前 端 框架 ， 首 先 都 要 学 习 框架 本 身 的 布局 风格 。 


AdminLTE 本 身 继承 了 Bootstrap 的 栅 格 布局 ， 并 在 此 基础 上 扩展 了 基础 布局 和 box 容 器 。 


1. 布 局 与 皮肤 


AdminLTE 官 方 源码 提供 了 starter.htm| 的 示例 文件 ， 开 发 者 可 以 通过 此 模板 文件 ， 了 解 AdminLTE 的 基本 页 面 结构 。 这 里 以 7.3.1 节 中 的 admin7 实 例 项 目 为 例 ， 访 问 starter.html 文 件 ， 浏 览 器 访问 效果 
如 图 7-17 所 示 。 


AdminLTE 


BB 是 人 Alexanderpierce 。 左 
3 Alexander Pierce Page Header optonaldesaripion 


Online 


起 Lavel lere 


% Link 
% AnotherLink 


% Multilev 


7-17 AdminLTE 提 供 的 快速 开始 示例 


AdminLTE 的 布局 主要 由 以 下 4 部 分 组 成 。 

Wrapper (.wrapper) : 一 个 div， 用 来 包 衷 整个 站 点 。 
:Main Header (.main-header) : 包含 logo 和 导航 条 。 
“Sidebar (.sidebar-wrapper) : 包含 用 户 面板 和 sidebar 菜 单 。 


”Content (.content-wrapper) : 包含 页 面 头 部 和 内 容 。 


AdminLTE 为 这 些 布局 类 提供 了 一 些 额 外 组 合 样式 。 下 面 列表 中 的 每 个 类 都 可 以 添加 到 body 标 签 上 ， 方 便 自 定义 效果 。 为 了 方便 演示 ， 在 admin7 项 目 根 目录 下 新 增 layout.html 文 件 。 


(1) 固定 布局 


使 用 fixed 类 ， 定 义 一 个 固定 导航 条 和 菜单 的 布局 ， 在 body 标 签 上 定义 ， 代 码 如 下 : 


<body class="hold-transition skin-blue fixed"> 


是 示 效 果 如 图 7-18 所 示 。 


AdminLTE 三 本 ae [4 从 AlexanderpPierce ” 姨 


Alexander Pierce 


Page Header optor 


7-18 ”固定 导航 条 、 菜 单 样式 


(2) 盒子 布局 


使 用 layout-boxed 类 ， 定 义 一 个 盒子 布局 效果 ， 宽 度 最 大 为 1250px， 代 码 如 下 : 


<body class="hold-transition skin-blue layout-boxed"> 


显示 效果 如 图 7-19 所 示 。 


AdminLTE p 人 AlexanderPierce ”名 


人 Page Header opionaldescrictior BLevel 


Online 


图 7-19 ”盒子 布局 样式 


(3) 项 部 导航 布局 


使 用 layout-top-nav 类 ， 实 现 移 除 侧 边 菜单 栏 ， 代 码 如 下 : 


<body class="hold-transition skin-blue layout-top-nav"> 


显示 效果 如 图 7-20 所 示 。 


p 人 Alexander Pierce 


Page Header optonal descript @ Level 


图 7-20 ”顶部 导航 样式 


(4) 收敛 侧 边 栏 布 


吨 


使 用 sidebar-collapse 和 sidebar-mini 样 式 ， 可 以 实现 一 个 收敛 侧 边 栏 效 果 ， 在 拥有 菜单 功能 的 同时 ， 让 主体 显示 面积 更 大 ， 代 码 如 下 : 


<body class="hold-transition skin-blue sidebar-mini sidebar-collapse"> 


显示 效果 如 图 7-21 所 示 。 


名 及 外 从 Alexander Pierce 


aldescnptlon @ level 


图 7-21 收敛 侧 边栏 效果 


人 提示 : 不 能 同时 使 用 layout-boxed 和 fixed 样 式 ， 其 他 样式 可 以 混合 使 用 。 


修改 皮肤 颜色 的 操作 方法 类 似 ， 只 需要 引入 对 应 的 样式 文件 ， 随 后 在 body 标 签 上 定义 类 即 可 。AdminLTE 默 认 提供 了 多 种 颜色 的 主题 ， 包 含 蓝 色 (skin-blue) 、 黑 色 (skin-black) 、 紫 色 (skin- 


purple) 、 黄 色 (skin-yellow) 、 红 色 (skin-red) 与 绿色 (skin-green) 。 系 统 默认 使 用 的 是 蓝 色 主题 ， 这 里 以 换 为 黄色 主题 为 例 ， 操 作 步 又 如 下 。 


(1) 引入 黄色 皮肤 主题 的 样式 表 。 代 码 修改 如 下 : 


<!--<link rel="stylesheet" href="dist/css/skins/skin-blue.min.css">--> 
<link rel="stylesheet" href="dist/css/skins/skin-yellow.min.css"> 


(2) 在 body 标 签 上 定义 类 。 代 码 修改 如 下 : 


<body class="hold-transition skin-yellow sidebar-mini"> 


刷新 浏览 器 ， 查 看 效果 如 图 7-22 所 示 。 


AdminLTE 所 [| Alexanderpierce ”如 


9 en Page Header optional description 人 


% Link 


图 7-22 更换 主 题 颜色 为 黄色 


提示 : 更 换 其 他 颜色 的 模板 皮肤 操作 类 似 ， 这 里 不 再 莹 述 。 


2.box 容 器 


相 比 Bootstrap 自 带 的 样式 ，AdminLTE 增 加 了 box 样 式 定义 布局 容器 。 常 见 的 box 布 局 样式 如 图 7-23 所 示 。 


Horizontal Form 
Email Email 
Password Password 
150 Remember me 
New Orders 
More info © 


图 7-23 ”AdminLTE 中 常见 的 box 布 局 样式 


AdminLTE 模 板 中 的 box 布 局 样式 ， 有 以 下 几 类 。 


(1) box 相 关 样 式 


此 类 预定 义 的 box 样 式 ， 布 局 结构 上 分 头 部 区 域 、 主 体 区 域 和 底部 区 域 ， 对 应 的 class 分 别 为 box-header、box-body 和 box-footer。 在 头 部 区 域 中 ， 又 分 为 标题 和 操作 区 域 (如 关闭 按钮 ) ， 对 应 的 
class 分 别 为 box-title 和 box-tools。 以 admin7 项 目 为 例 ， 在 根 目录 下 创建 一 个 box.html 文 件 ， 初 始 化 内 容 与 starter.html 一 致 。 随 后 定义 一 个 标准 的 box， 代 码 如 下 : 


<div class="box box-success box-solid"> 
<!--box 头 部 区 域 --> 
<div class="box-header"> 
<i class="fa fa-comments-o"></i> 
<h3 class="box-title"> 
标题 内 容 
</h3> 
<div class="box-tools pull-right"> 
<div class="btn-group"> 
<a class="btn btn-danger"> 关 闭 </a> 
</div> 
</div> 
</div> 
<!--box 内 容 展示 区 域 --> 
<div class="box-body"> 
这 里 包含 主体 内 容 
</div> 
<!--box 底 部 展示 区 域 --> 
<div class="box-footer"> 
底部 说 明 
</div> 
</div> 


在 浏览 器 中 访问 ， 如 图 7-24 所 示 。 


久 标题 内 容 


这 里 包含 主体 内 容 


底部 说 明 


图 7-24 ”实现 基本 的 box 布 局 样式 


与 定义 body 样 式 切 换 主题 类 似 ，box 也 有 几 个 预定 义 的 风格 样式 ， 有 默认 (box-default) 、 成 功 (box-success) 、 警 告 (box-warning) 和 错误 (box-danger) 几 种 。 例 如 在 box 类 后 增加 box- 
success 类 如 下 : 


<div class="box box-success"> 


效果 如 图 7-25 所 示 。 


久 标题 内 容 


展示 主体 内 容 


展示 底部 内 容 


图 7-25 ”修改 box 的 显示 风格 


也 可 以 使 用 box-solid 样 式 ， 控 制 box 头 部 颜色 显示 的 范围 (顶部 线条 展示 或 全 部 展示 ) ， 代 码 如 下 : 


<div class="box box-success box-solid"> 


效果 如 图 7-26 所 示 。 


名 标题 内 容 
展示 主体 内 容 


展示 底部 内 容 


7-26 ”控制 box 头 部 颜色 显示 范围 


(2) info-box 


info-box 及 其 相关 的 类 ， 一 般 用 于 定义 消息 提示 类 的 布局 。 结 构 上 包括 左 侧 图 片 (icon) 和 右 侧 内 容 (content) ， 对 应 的 class 分 别 为 info-box-icon 和 info-box-content。 和 box 的 头 部 区 域 类 


似 ，info-box-content 下 ， 又 可 以 添加 info-box-text、info-box-number 和 info-box-more 样 式 。 


例如 ， 一 个 典型 的 info-box 实 现代 码 如 下 : 


<div class="info-box"> 
<!-- 左 侧 的 带 背 景色 的 图 标 部 分 --> 
<span class="info-box-icon bg-aqua"><i class="fa fa-envelope-o"> </i></span> 
<!-- 内 容 展 示 部 分 --> 
<div class="info-box-content"> 
<span cla. info-box-text"> 显 示 文 字 内 容 </span> 
<span class="info-box-number"> 显 示 数 字 内 容 </span> 
<span class="info-box-more pull-right"> 右 侧 更 多 </span> 
</div> 
</div> 


展示 效果 如 图 7-27 所 示 。 


显示 文字 内 容 


图 7-27 典型 的 info-box 布 局 效果 


若 需要 修改 内 容 展 示 区 域 的 背景 颜色 ， 只 需要 在 info-box 类 后 追加 bg -颜色 类 即 可 。 例 如 修改 背景 颜色 为 绿色 ， 代 码 如 下 : 


<div class="info-box bg-green"> 


展示 效果 如 图 7-28 所 示 。 


显示 文字 内 容 


图 7-28 ”修改 info-box 展 示 内 容 的 背景 颜色 
(3) small-box 


small-box 定 义 了 更 小 巧 的 信息 提示 布局 ， 子 类 定义 也 只 有 small-box-footer， 代 码 如 下 : 


<!-- 整 个 box 为 绿色 背景 色 --> 
<div class="small-box bg-green"> 
<!-- 要 ! 六 字 一 -> 
<div class="inner"> 
<h3> 标 题 内 容 </h3> 
<p> 内 容 </p> 
</div> 
<!-- 可 在 右 侧 显示 的 背景 --> 
<div class="icon"> 
<i class="fa fa-shopping-cart"></i> 
</div> 
<!-- 更 多 链接 及 图 标 --> 
<a href="#" class="small-box-footer"> 
更 新 <i class="fa fa-arrow-circle-right" 
></i> 
</a> 
</div> 


展示 效果 如 图 7-29 所 示 。 


图 7-29 ”典型 的 small-box 布 局 效果 


后 台 管理 页 面 中 ， 列 表 和 表单 使 用 的 频率 很 高 ， 如 订单 列表 、 用 户 列 表 和 新 增 商品 等 。 本 节 开 始 尝试 设计 一 套 通 用 的 列表 、 表 单 样式 ， 为 后 面 的 内 容 开 发 系统 打下 样式 基础 。 首 先 来 看 如 何 实现 一 个 通 
用 的 列表 页 面 ， 结 构 示 意 如 图 7-30 所 示 。 


http://www.wangjialin.com 


顶部 导航 ， 包 含 用 户 信息 操作 区 域 


条 件 1: | 条件 2: | 下 拉 选 页 国 | “搜索 


Dp | 纹 | A | Mg | WS | MF 
EE 


芭 用 圳 除 


正常 编辑 删除 


正常 删除 
正常 删除 
正常 删除 
正常 编辑 删除 


= 


图 7-30 ”常用 列表 布局 结构 示意 图 


通用 的 列表 ， 一 般 由 以 下 几 个 部 分 构成 : 
“ 表单 搜索 ， 顶 部 一 般 会 有 关键 字 搜 索 、 状 态 选择 项 等 ， 可 供用 户 数据 检索 。 
“ 主体 列表 ， 每 行 包含 记录 展示 、 状 态 展 示 和 操作 区 域 等 ， 操 作 区 域 中 可 以 执行 页 面 重 定向 、 状 态 迁 移 等 功能 。 


“ 分 页 ， 记 录 超 过 分 页 固定 条 数 ， 展 示 分 页 操作 区 域 。 


实例 最 终 完成 的 效果 图 ， 如 图 7-31 所 示 。 


列表 通过 列表 样式 
高 级 检索 


搜索 项 ”请 输入 关键 字 


表格 列表 


列表 ID 列表 号 


12 


12 


12 


12 


2017111212121212 


2017111212121212 


2017111212121212 


2017111212121212 


下 面 根据 实例 步骤 来 演示 列表 的 实现 : 


(1) 新 增 列表 模板 页 


(2) 


主体 内 容 布 局 


列表 值 1 

¥¥123.45 元 
半 123.45 元 
羊 123.4570 


半 123.45 元 


以 上 面 创建 的 admin7 实 例 为 例 ， 新 增 table.html 页 面 ， 并 复制 starter.html 中 的 基础 结构 代码 。 


列表 操作 时 间 

2017-12-12 12:12 
2017-12-12 12:12 
2017-12-12 12:12 


2017-12-12 12:12 


图 7-31 定义 通用 列表 样式 效果 完成 图 


因为 AdminLTE 基 于 Bootstrap 框 架 开发 ， 其 所 带 的 预定 义 样式 都 可 以 使 


。 所 以 在 这 里 使 用 栅 格 布 


局 定义 表格 列表 的 外 部 容器 ， 在 content 类 定义 的 section 元 素 中 ， 


增加 代码 如 下 : 


<!-- 表 格 开 


始 --> 


<div class="row" 

A 入 有 cssp 的 全 局 样式 row__> 

<div class="col-md-12"> 

<!-- 使 用 bootstrap 的 全 局 样式 col 控制 box 的 宽度 100%--> 
<!-- 全 局 搜索 区 域 -~-> 


<div 


class="box"> 


<div class="box-header"> 


<h3 class="box-title"> 高 级 检索 </h3> 


</div> 
<div class="box-body"> 


显示 全 局 搜索 区 域 


</div> 
</div> 
<!-- 列 表 展 示 区 域 --> 


<div 


class="box"> 


<div class="box-header" 


<h3 class=" te "表格 列表 </h3> 


</div> 
<div class="box-body"> 


显示 表格 列表 
<div class="row"> 
<div class="col-md-6"></div> 


<div class="col-md-6" style="text-align: right;"> 


显示 分 页 区 域 
</div> 
</div> 
</div> 
</div> 
</div> 
</div> 
代码 中 使 用 Bootstrap 的 栅 格 布局 定义 外 层 容 器 ， 使 用 AdminLTE 的 box 样 式 定义 内 层 容 器 。 在 浏览 器 中 访问 table.html 页 面 ， 显 示 效 果 如 图 7-32 所 示 。 
(3) 搜索 表单 
在 全 局 搜索 区 域 中 的 box-body 中 增加 表单 项 ， 实 现 搜索 样式 。 核 心 代码 如 下 : 


<form class="form-inline"> 

<div class="form-group"> 
<p class="form-control-static"> 搜 索 项 </p> 
</div> 
<div class="form-group"> 
<input type="text" class="form-control" placeholder=" 请 输入 关键 字 "> 
</div> 
<div class="form-group"> 


<p class="form-control-static"> 状 态 </p> 
</div> 
<div class="form-group"> 

<select class="form-control"> 

<option> 正 常 </option> 

</select> 
</div> 
<button type="submit" class="btn btn-info"> 搜 索 </button> 
<button type="submit" class="btn btn-warning"> 清 除 条 件 </button> 

</form> 


列表 通过 列表 样式 


高 级 检索 
显示 全 局 搜索 区 域 


表格 列表 
显示 表格 列表 


图 7-32 ”定义 列表 的 布局 容器 


需要 注意 的 是 ， 搜 索 表单 项 使 用 了 Bootstrap 的 表单 相关 样式 ， 实 现 同行 中 显示 多 个 表单 元 素 。 不 过 在 实例 中 ， 只 定义 了 单个 的 文本 框 和 单 选 框 ， 开 发 者 根据 自身 需求 可 以 灵活 追加 。 展 示 效 果 如 图 7- 
33 所 示 。 


列表 通过 列表 样式 


高 级 检索 


搜索 项 ”请 输入 关键 字 


7-33 定义 列表 的 全 局 搜索 项 


(4) 列表 样式 


使 用 Bootstrap 自 带 的 table 相 关 预 定义 样式 ， 定 义 列表 。 在 列表 展示 的 box-body 布 局 容器 中 ， 增 加 以 下 代码 : 


<table class="table table-bordered table-stripe"> 
<thead> 
br 
<th> 列 表 ID</th> 
<th> 列 表 号 </th> 
<th> 列 表 值 1</th> 
<th> 列 表 操 作 时 间 </th> 
<th> 状 态 </th> 
<th> 操 作 </th> 
Es 
</thead> 
<tbody class=""> 
LE 
<td>12</td> 
<td>2017111212121212 
</td> 
<td>¥123.45 元 </td> 
<td>2013=12=12. 12:12</td> 
<td><span class="label label-success"> 正 常 </span></td> 
<td> 
<a> 编 辑 </a><a> 删 除 </a> 


</tbody> 
</table> 


在 表格 中 ，table-bordered 样 式 定义 带 边框 的 表格 ，table-stripe 则 实现 隔行 换 色 。 访 问 table.html 页 面 ， 效 果 如 图 7-34 所 示 。 


表格 列表 


列表 ID 列表 号 列表 值 1 列表 操作 时 间 操作 

12 2017111212121212 ¥¥123.45 元 2017-12-12 12:12 编辑 删除 
12 2017111212121212 半 123.45 元 2017-12-12 12:12 编辑 删除 
12 2017111212121212 半 123.45 元 2017-12-12 12:12 编辑 删除 


2017111212121212 站 123.45 元 2017-12-12 12:12 编辑 删除 


显示 分 页 区 域 


7-34 定义 列表 主体 样式 


(5) 分 页 样式 。 


使 用 Bootstrap 预 定义 的 分 页 样式 ， 蔡 换代 码 中 “显示 分 页 区 域 ”的 文本 ， 代 码 如 下 : 


<nav aria-label="Page navigation" class=""> 
<ul class="pagination"> 
<1i> 
<span aria-hidden="true"> 上 一 页 </span> 
</a> 
</1i> 
<1li class="active"><a href="#">1</a></1i> 
<li><a href="#">2</a></1i> 
<li><a href="#">3</a></1i> 
<li><a href="#">4</a></1i> 
<li><a href="#">5</a></1i> 
<1i> 
<a href="#" aria-label="Next"> 
<span aria-hidden="true"> 下 一 页 </span> 
</a> 
</1i> 
</ul> 
</nav> 


查看 页 面 效果 ， 如 图 7-35 所 示 。 


图 7-35 ”定义 列表 分 页 样式 


7.3.4 ”实现 常用 模板 一 一 表单 


了 解 列表 相关 样式 后 ， 本 节 继 续 学 习 表单 相关 样式 的 定义 。 实 际 使 用 中 ， 数 据 操作 大 多 离 不 开 表单 。 除 了 常用 的 文本 框 、 选 择 项 、 单 选 和 多 选 等 基本 样式 外 ， 其 他 样式 如 富 文本 编辑 器 、 文 件 上 传 进度 
条 和 错误 提示 样式 等 也 常常 用 到 。 


为 了 方便 演示 ， 继 续 使 用 admin7 项 目 ， 新 增 form.html 文 件 ， 复 制 starter.html 内 容 为 基本 样式 ， 实 现 一 个 通用 表单 。 


(1) 表单 布局 


表单 的 布局 与 列表 类 似 ， 通 过 栅 格 布局 和 box 容 器 定义 ， 在 content 定 义 的 div 中 代码 如 下 : 


<!-- 使 用 bootstrap 的 全 局 样式 row--> 
<div class="row"> 
<!-- 使 用 bootstrap 的 全 局 样式 col 控制 box 的 宽度 --> 
<div class="col-md-12"> 
<!-- box 容 器 放置 表单 --> 
<div class="box"> 
<!-- 表 单 名 --> 


<div class="box-header"> 


<h3 class="box-title"> 通 用 表单 </h3> 
</div> 
<!-- 表 单 主体 元 素 --> 


<div class="box-body"> 
表单 内 容 


</div> 
<div class="box-footer"> 


表单 操作 按钮 ， 如 提交 、 取 消 等 
</div> 
</div> 
</div> 
</div> 


在 浏览 器 中 访问 form.html， 效 果 如 图 7-36 所 示 。 


通用 表单 


表单 内 容 


表单 操作 按钮 ， 如 提交 、 取 消 等 


7-36 通用 表单 布局 


(2) 表单 基本 项 


表单 基本 项 包含 了 文本 框 、 下 拉 选 择 框 、 单 选 按钮 、 复 选 框 等 ， 可 以 使 用 Boostrap 框 架 预定 义 的 表单 样式 。Bootstrap 常 见 表单 样式 类 的 实现 ， 对 应 的 效果 如 


7-37 所 示 。 


[ 


form 
form-group 
form-control 


form:form-inline 
Label Label | input 文 本 输入 框 form-group 
form-control 


input-group 
input-group-addon 

form-group 
input-group-addon 


form:form-horizontal 
IrOW:COlS-**-2 


7-37 ”使 用 Bootstrap 预 定义 的 表单 样式 


在 box 中 的 box-body 类 容器 中 ， 追 加 以 下 代码 : 


<form class="form-horizontal"> 
<div class="form-group"> 
<label for="inputEmail3" class="col-sm-2 control-label"> 
文本 输入 
</label> 
<div class="col-sm-6"> 
<input type="email" class="form-control" id="inputEmail3" 
placeholder=" 邮 箱 "> 
</div> 
</div> 
<div class="form-group"> 
<label for="inputPassword3" class="col-sm-2 control-label"> 密 码 输入 
</label> 
<div class="col-sm-6"> 
<input type="password" class="form-control" id="inputPassword3" 
placeholder=" 输 入 密码 "> 
</div> 


</div> 
<div class="form-group"> 
<label for="inputEmail3" class="col-sm-2 control-label"> 选 择 性 别 
</label> 
<div class="col-sm-3"> 
<select class="form-control"> 
<option> 男 性 </option> 
<option> 女 性 </option> 
</select> 
</div> 
</div> 
<div class="form-group"> 
<label for="inputEmail3" class="col-sm-2 control-label"> 文 本 域 
</label> 
<div class="col-sm-6"> 
<textarea class="form-control" rows="3"></textarea> 
</div> 
</div> 
<div class="form-group"> 
<label for="inputEmail3" class="col-sm-2 control-label"> 多 选 
</label> 
<div class="col-sm-6"> 
<div class="checkbox"> 
<label> 
<input type="checkbox"> 
选项 1 
</label> 
<label> 
<input type="checkbox"> 
选项 2 
</label> 
<label> 
<input type="checkbox"> 
选项 3 
</label> 
</div> 
</div> 
</div> 
<div class="form-group"> 
<label for="inputEmail3" class="col-sm-2 control-label"> 单 选 
</label> 
<div class="col-sm-6"> 
<div class="radio"> 
<label> 
<input type="radio" name="optionsRadios" id=" 
optionsRadiosl" value="option1" checked="checked"> 
选项 1 
</label> 
<label> 
<input type="radio" name="optionsRadios" id=" 
optionsRadios2" value="optionl" checked=""> 
选项 2 
</label> 
</div> 
</div> 
</div> 
</form> 


在 浏览 器 中 查看 效果 ， 如 图 7-38 所 示 。 


7-38 定义 常用 的 表单 元 素 


(3) 提示 样式 


数据 提交 前 需要 做 表单 验证 ， 为 了 让 用 户 可 以 更 快 了 解 哪个 输入 项 出 了 问题 ， 提 示 必 不 可 少 。 这 里 以 文本 输入 框 为 例 ， 使 用 AdminLTE 自 带 样式 has-success 和 has-error， 定 义 不 同 的 提示 效果 ， 代 码 


如 下 : 
<div class="form-group has-success"> <!-- 成 功 的 表单 项 ， 需 要 增加 has-success 
预定 义 类 --> 
<label for="inputEmai13" class="col-sm-2 control-label"> 
文本 输入 
</label> 


<div class="col-sm-6"><!-- 控 制 INPUT 元 素 的 宽度 --> 
<input type="email" class="form-control" id="inputEmail3" 
Placeholder=" 邮 箱 "> 

</div> 

<!-- 表 单 提示 区 域 -~-> 


<span class="help-block"> 


<i class="fa fa-check"></i> <!-- 成 功 的 提示 --> 
成 功 提示 文本 
</span> 
</div> 


<div class="form-group has-error"> 
<label for="inputPassword3" class="col-sm-2 control-label"> 密 码 输入 
</label> 
<div class="col-sm-6"> 
<input type="password" class="form-control" id="inputPassword3" 
Placeholer-" 基 入 密码 "> 
</div> 


<!-- 表 单 提示 区 域 --> 
<span class="help-block"> 
<i class="fa fa-times-circle-o"></i> <!-- 成 功 的 提示 --> 
失败 提示 文本 
</span> 
</div> 


输入 正确 和 错误 的 提示 效果 ， 如 图 7-39 所 示 。 


Y 成 功 提示 文本 


四 失败 提示 文本 


7-39 输入 正确 或 者 错误 的 提示 效果 


上 述 修改 ， 除 了 定义 表单 元 素 的 提示 颜色 ， 还 用 到 了 help-block 类 ， 来 定义 表单 元 素 后 提示 文本 的 布局 样式 。 


(4) 日 期 选择 器 


在 一 些 需要 输入 特殊 格式 的 表单 项 ， 如 日 期 、 时 间 格 式 等 ， 表 单 会 提供 相应 的 日 期 选择 器 插件 ， 以 提高 正确 格式 输入 的 成 功率 ， 也 提高 了 用 户 使 用 体验 。AdminLTE 本 身 引 入 了 日 期 相关 类 的 插件 ， 主 
要 有 以 下 几 种 。 


“ bootstrap-datepicker: 标准 日 期 选择 插件 ， 日 期 格式 为 2017-12-31， 展 示 格 式 可 以 自 定 义 。 
“bootstrap-daterangepicker: 标准 日 期 范围 选择 插件 。 默 认 提 供 两 个 日 期 选择 框 ， 用 户 可 以 选择 两 个 日 期 范围 内 的 时 间 段 。 


“bootstrap-timepicker: 标准 时 间 选 择 插 件 ， 提 供 精 确 到 时 、 分 、 秒 的 时 间 选 择 。 


这 里 以 bootstrap-datepicker 插 件 为 例 ， 在 通用 表单 实例 中 引入 年 、 月 、 日 格式 的 日 期 选择 效果 。 


首先 在 form.htmlI 页 面 的 头 部 和 底部 ， 引 入 bootstrap-datepicker 的 CSS 样 式 表 和 JavaScript 库 文件 ， 代 码 如 下 : 


<!-~ bootstrap datepicker -~-> 
<link rel="stylesheet" href="bower components/bootstrap-datepicker/ 
dist/css/bootstrap-datepicker.min.css"> 


<!-- RdminLTE App --> 

<script src="dist/js/adminlte.min.js"></script> 

<!-- bootstrap datepicker --> 

<script src="bower components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script> 


从 提示 : bootstrap-datepicker 插 件 依赖 jQuery 框架 。 


定义 文本 输入 标签 ， 展 示 日 期 交互 操作 ， 代 码 如 下 : 


<div class="form-group"> 
<label for="inputEmail3" class="col-sm-2 control-label"> 日 期 选择 
</label> 
<div class="col-sm-6"> 
<div class="input-group date"> 
<div class="input-group-addon"> 
<i class="fa fa-calendar"></i> 
</div> 
<!-- 注意 定义 ID 属性 --> 
<input type="text" class="form-control pull-right" id=" 
datepicker"> 
</div> 
</div> 
</div> 


最 后 定义 JavaScript 脚 本 实现 日 期 选择 效果 ， 代 码 如 下 : 


<script> 
$ (function () { 
// 日 期 选择 插件 ， 参 数 配置 
$('#datepicker') .datepicker ({ 
autoclose: true， ”// 选中 后 自动 关闭 
format : 'yyyy-mm-dd', // 选择 日 期 格式 ， 配 置 年 、 月 、 日 的 显示 位 置 和 样式 


]) 7 


1 
</script> 


在 浏览 器 中 访问 form.html 文 件 ， 效 果 如 图 7-40 所 示 。 
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7-40 在 通用 表单 中 定义 日 期 插件 


(5) 富 文本 编辑 器 


富 文 本 编辑 器 用 于 发 布 带 样式 的 内 容 文本 ，AdminLTE 集 成 了 流行 的 开源 编辑 器 ckeditor。 其 使 用 原理 与 日 期 插件 类 似 ， 首 先 引入 ckeditor 揪 件 的 Javascript 脚 本 库 文件 ， 代 码 如 下 : 


<!-- bootstrap datepicker --> 

<script src="bower components/bootstrap-datepicker/dist/js/bootstrap-datepicker 
.min.js"></script> 

EGR 

<script src="bower components/ckeditor/ckeditor.js"></script> 


随后 定义 文本 域 元 素 ， 代 码 如 下 : 


<!-- 富 文 本 编辑 器 --> 
<div class="form-group"> 
<label for="editorl" class="col-sm-2 control-label"> 富 文本 编辑 器 
</label> 
<div class="col-sm-6"> 
<textarea id="editorl" name="editorl" rows="10" cols="80"> 
文本 域 默 认 展 示 内 容 
</textarea> 
</div> 
<span class="help-block"><i class="fa fa-check"></i> <!-- 成 功 的 提示 --> 
输入 成 功 </span> 
</div> 


最 后 借助 CKEDITOR 对 象 ， 实 现 富 文 本 编辑 器 的 泻 染 ， 代 码 如 下 : 


// 通 过 ID 属性 ， 蔡 换 默 认 文 本 域 为 富 文本 编辑 器 
CKEDITOR. replace ('editorl1') 


在 浏览 器 中 访问 ,效果 如 图 7-41 所 示 。 
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1 在 通用 表单 中 定义 富 文本 编辑 器 


(6) 提交 按钮 组 


最 后 别 忘 了 提交 按钮 组 ， 在 box-footer 结 构 中 定义 。 这 里 以 非 表单 直接 提交 为 例 ， 代 码 如 下 : 


<div class="box-footer"> 
<button type="submit" class="btn btn-default"> 取 消 </button> 
<button type="submit" class="btn btn-info pull-right"> 保 存 </button> 
</div> 


效果 如 图 7-42 所 示 。 


图 7-42 ”定义 通用 表单 的 提交 按钮 组 


第 8 章 ThinkPHP 命 令 行 操作 与 接口 开发 实战 


ThinkPHP 是 优秀 的 国产 开源 框架 。 它 不 仅 有 丰富 的 中 文 文档 ， 还 有 很 多 开源 的 项 目 实例 。 本 章 不 是 罗列 ThinkPHP 的 零碎 知识 点 ， 而 是 解析 ThinkPHP 5 版 本 中 的 新 特性 ， 以 帮助 开发 者 学 习 如 何 使 用 
ThinkPHP 增 强 的 命令 行 操作 和 接口 开发 等 常用 方法 ， 从 而 掌握 该 框架 的 核心 技巧 。 


8.1 ThinkPHP 5 与 命令 行 操 作 


本 节 重 点 讲解 如 何 使 用 Composer 创 建 全 新 的 ThinkPHP 5 项 目 ， 引 导 开 发 者 在 实战 中 熟悉 和 使 用 命令 行 操作 。 


8.1.1 ThinkPHP 简 介 


ThinkPHP 是 免费 开源 的 面向 对 象 轻 量 级 PHP 开 发 框架 ， 是 为 实现 敏捷 Web 应 用 开发 和 简化 企业 应 用 开发 而 诞生 的 。ThinkPHP 从 诞生 以 来 一 直 秉 承 简洁 、 实 用 的 设计 原则 ， 在 保持 出 色 性 能 和 至 简 代码 
的 同时 ， 也 注重 易 用 性 。ThinkPHP 的 Logo 如 图 8-1 所 示 。 
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图 8-1 ThinkPHP 的 Logo 


目前 有 很 多 使 用 ThinkPHP 作 为 核心 框架 的 开源 项 目 ， 如 图 8-2 所 示 。 
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图 8-2 ”以 ThinkPHP 为 核心 框架 的 开源 项 目 


ThinkPHP 的 最 新 版 本 为 5.0.x， 相 比 上 一 个 版 本 3.2.x， 其 对 整体 框架 进行 了 重 构 ， 新 版 本 的 优势 主要 有 以 下 几 个 方面 : 


“ 灵活 的 路 由 和 API 开 发 的 友好 ; 


“ 新 的 请 求 处 理 对 象 ; 


“ 新 的 查询 机 制 和 模型 功能 ; 


“ 增强 的 调试 、 单 元 测试 和 异常 处 理 ; 


“ Composer 和 命令 行 的 支持 。 


有 A 提示: ThinkPHP 5 还 在 快速 迁 代 ， 目 前 已 经 发 布 ThinkPHP 5.1 的 开发 者 预览 版 


8.1.2 ”使 用 Composer 创 建 ThinkPHP 5 项 目 


ThinkPHP 有 多 种 安装 方式 ， 


在 命令 行 中 执行 以 下 命令 : 


这 里 推荐 使 用 Composer 方 式 。 为 了 方便 演示 ， 实 例 使 用 Composer 全 新 安装 ThinkPHP 5， 


项 目 名 为 tp5api。 


composer create-project topthink/think tp5api --prefer-dist 


关于 Composer 的 安装 与 使 用 ， 在 第 6 章 已 经 详细 介绍 过 ， 这 里 不 再 歼 述 。 
上 述 命令 执行 过 程 如 下 ， 说 明 已 经 安装 成 功 : 


wangjialin@wangjialin-gamepc MINGW64 /d/phpstudy/WiW 


$ composer create-project topthink/think tp5api 


-~-prefer-dist 


Installing topthink/think (v5.0.12) 


-=- Installing topthink/think (v5.0.12): 


Downloading (100%) 


Created project in tp5api 
Loading composer repositories with package information 
Updating dependencies (including require-dev) 


Package operations: 
=- Installing topthink/think-installer (v1.0.12): 
=- Installing topthink/framework (v5.0.12): 


2 installs, 0 updates, 0 removals 
Downloading (100%) 
Downloading (100%) 


Writing lock file 
Generating autoload files 


在 浏览 器 中 访问 地 址 http://localhost/tp5api/public， 展 示 效 果 如 图 8-3 所 示 ， 说 明 ThinkPHP 框 架 可 以 正常 运行 。 
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出 现 此 界面 则 说 明 ThinkPHP 安 装 成 功 


图 8-3 


有 A 提示: 相 比 ThinkPHP 3，ThinkPHP 5 最 低 支持 的 PHP 版 本 为 PHP 5.4， 并 且 完 美 支持 PHP 7。 


8.1.3 ThinkPHP 5 命令 行 操作 


相 比 上 一 个 版 本 ，ThinkPHP 5 增加 了 很 多 全 新 的 特性 ， 命 令 和 


J 就 是 其 一 。 


计 的 高 


在 命令 行 下 ， 一 些 传统 的 手动 操作 可 以 自动 完成 ， 如 创建 模块 、 文 件 ， 一 些 不 适合 在 页 面 上 调试 的 功能 ,也 可 以 在 命令 行 下 进行 调试 。 下 面 以 实例 项 目 tp5api 为 例 进 行 讲 解 。 如 需 查 看 框架 默认 提供 的 
命令 ， 则 在 命令 行 中 输入 以 下 命令 : 

php think 

执行 结果 如 下 : 


wangjialin@wangjialin-gamepc MINGW64 /d/phpStudy/WiW/tp5api 
$ php think 
Think Console version 0.1 


Usage: 
command [options] [arguments] 
Options: 
-h, --help Display this help message 
-V, --version Display this console version 
-q, ~--quiet Do not output any message 
-~ansi Force ANSI output 
--no-ansi Disable ANSI output 


-ny 


--no-interaction Do not ask any interactive question 


-vivvlvvv, --verbose Increase the verbosity of messages: 1 for normal 
output, 2 for more verbose output and 3 for deb 


ug 
Available commands: 
build Build Application Dirs 
clear Clear runtime file 
help Displays help for a command 
list Lists commands 
make 
make:controller Create a new resource controller class 
make:model Create a new model class 
optimize 


optimize:autoload Optimizes PSRO and PSR4 packages to be loaded with 
classmaps too, good for production. 


optimize:config Build config and common file cache. 
optimize:route Build route cache. 
optimize:schema Build database schema cache. 


从 帮助 的 提示 信息 来 看 ， 框 架 中 提供 了 各 种 操作 命令 ， 方 便 开 发 者 使 用 。 


全 提示 : 命令 行 工具 需要 在 命令 行 下 面 执行 ， 请 先 确保 用 户 的 php.exe 已 经 加 入 了 系统 环境 变量 Path。 


1. 生 成 模块 


在 老 版 本 的 框架 中 ， 生 成 模块 必须 手动 操作 ， 费 时 、 费 力 ， 还 容易 出 错 。ThinkPHP 5 中 可 以 使 用 对 应 的 指令 自动 生成 模块 ， 操 作 步 骤 如 下 。 


(1) 创建 配置 脚本 文件 


在 实例 tp5api 项 目 中 ， 在 根 目 录 下 有 一 个 build.php 脚 本 文件 ， 它 提供 了 模块 生成 的 示例 定义 。 下 面 以 生成 名 为 api 的 新 模块 为 例 ， 首 先 需要 在 application 目 录 下 面 创建 一 个 build.php 配 置 文件 ， 文 件 
内 容 如 下 : 


<?php 
return [ 
// 定义 API 模 块 的 自动 生成 (按照 实际 定义 的 文件 名 生成 ) 
rapi' => [ // 定义 模块 名 
'_file_' => ['common.php'], // 定义 公共 方法 文件 名 
| => ['behavior', 'controller', 'model', 'view'], // 定义 默认 目录 
‘controller' => ['Index', 'Test', 'UserType'], // 定义 默认 控制 器 文件 
'model' => ['User'，'UserType']， // 定义 默认 模型 文件 
"view' => ['index/index'], // 定义 默认 视图 目录 


(2) 执行 生成 操作 


在 tp5api 根 目录 下 ， 执 行 生成 命令 ， 结 果 如 下 ， 则 说 明 操 作成 功 。 


$ php think build 
Successed 


(3) 查看 结果 


进入 application 目 录 下 ， 发 现 api 模 块 已 经 自动 创建 完成 ， 随 后 在 浏览 器 中 访问 地 址 http://localhost/tp5api/public/index.php/api， 结 果 如 图 8-4 所 示 。 
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图 8-4 出 现 此 界面 说 明 命令 行 创建 的 控制 器 执行 成 功 
全 提示 : Build.php 文 件 中 的 配置 项 不 都 是 必 填 项 ， 可 以 根据 需求 灵活 配置 。 


2. 生 成 控制 器 和 模型 文件 


除了 初始 化 模块 目录 ， 还 可 以 使 用 make 命 令 生成 控制 器 和 模型 文件 。 例 如 : 生成 订单 相关 的 控制 器 和 模型 ， 命 令 操作 和 执行 结果 如 下 : 


cmd /d/phpStudy/www/tp5api 
$ php think make:controller api/Order 
Controller created successfully. 


cmd /d/phpStudy/www/tp5api 
$ php think make:model api/Order 
Model created successfully. 


需要 说 明 的 是 ，make: controller 命 令 默 认 生 成 的 是 资源 控制 器 ， 自 带 初 始 化 方法 定义 。 核 心 方法 如 下 : 


<?php 
namespace app\api\controller; 


use think\Controller; 
use think\Request; 
Class Order extends Controller 
. 交 
* 显示 资源 列表 
* @return \think\Response 
和 


public function index() 


人 


若 希望 创建 一 个 空 控制 器 ， 则 只 需要 执行 以 下 代码 即 可 : 


php think make:controller api/Order--plain 


3. 自 定义 命令 扩展 一 一 清除 全 部 会 话 信息 


命令 行 的 作用 远 不 止 生成 目录 和 文件 这 么 简单 ， 开 发 者 还 可 以 方便 地 扩展 自己 的 指令 ， 实 现 特定 的 功能 需求 。 这 里 扩展 一 个 用 于 会 话 信息 的 指令 ， 操 作 步 又 如 下 。 
(1) 创建 指令 类 


在 application 下 创建 console 目 录 ， 新 增 Session.php 文 件 。 核 心 代码 如 下 : 


// 会 话 控制 命令 


class Session extends Command 


{ 
// 指令 配置 


Protected function configure () 


// 设置 命令 名 、 额 外 选项 和 描述 信息 

$this->setName ('session') 
->addoption('clear' , 'd' , Option::VALUE NONE , 'clear all 
session' , null) 
->setDescription('Clear Session file'); 


} 
// 指令 操作 


protected function execute (Input $input, Output $output) 
// 获取 指令 选项 名 称 
$path = $input->getOption('clear'); 
if ($path) 


// 执行 清除 会 话 信息 操作 
unset ($_SESSION); 
$output->writeln ("Clear Session Successed"); 


下 
else 


$output->writeln ("Clear Nothing"); 


提示: 一 个 合法 的 命令 类 ， 不 必要 求 有 固定 的 目录 和 命名 空间 ， 但 必须 继承 think\console\command\Command 或 者 其 子 类 ， 并 且 定 义 configure () 和 execute () 两 个 方法 。 


在 自 定义 的 命令 类 中 ，configure () 方法 定义 了 命令 的 名 称 、 选 项 和 功能 描述 ， 其 中 setName () 和 setDescription () 方法 较 好 理解 ， 分 别 为 定义 命令 的 名 称 和 功能 描述 。 而 addOption () 方法 
参数 较 多 ， 根 据 定义 的 参数 说 明 如 下 。 


“ clear: 指令 的 选项 名 定义 。 
“ d: 指令 的 选项 名 别名 。 


- Option: : VALUE_NONE: 选项 类 型 ， 值 对 应 没有 输入 值 (VALUE_NONE) 、 输 入 值 必须 (VALUE_REQUIRED) 、 输 入 值 可 选 (VALUE_OPTIONAL) 和 数组 输入 值 (VALUE_IS_ARRAY) 4 
种 。 


“ clear all session: 选项 说 明 信 息 。 


“ null: 默认 值 ， 没 有 则 默认 为 null。 


execute () 方法 处 理 具体 的 输入 、 输 出 和 实际 处 理 逻 辑 。 实 例 中 的 功能 实现 较为 简单 ， 只 是 使 用 unset () 方法 清空 了 会 话 数据 ， 实 际 开发 中 会 比 实例 更 为 复杂 : 


// 执行 清除 会 话 信息 操作 
unset ($_SESSION); 


(2) 注册 指令 类 


在 application 目 录 下 面 的 command.php (如 果 不 存在 ， 则 需 创建 ) 文件 中 ， 添 加 如 下 内 容 : 


return [ 
'\app\console\Session', 


也 


为 了 验证 是 否 注册 成 功 ， 可 以 执行 以 下 指令 : 


php think list 


执行 结果 如 下 ， 则 说 明 注 册 成 功 。 


Available commands: 


build Build Application Dirs 
clear Clear runtime file 

help Displays help for a command 
list Lists commands 

session Clear Session file 


(3) 测试 自 定义 指令 


执行 下 面 代码 的 第 一 行 指令 ， 则 显示 结果 如 下 面 代码 的 第 二 行 : 


$ php think session --clear 
Clear Session Successed 


也 可 以 


别名 执行 ， 则 提示 如 下 : 


$ php think session -d 
Clear Session Successed 


若 指令 输入 不 存在 ， 则 提示 如 下 : 


$ php think session 
Clear Nothing 


若 别名 输入 有 误 ， 则 提示 如 下 : 


$ php think session -a 
[RuntimeException] 
The "-a" option does not exist. 
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第 9 章 ”内 容 管理 框架 实战 一 一 基础 架构 、 用 户 与 菜单 管理 


内 容 管 理 框架 (Content Manager Framework，CMF) ， 不仅 
竺 ， 以 及 提供 了 通用 的 模板 样式 (如 AdminLTE) 与 JavaScript 交 互 脚本 . 


本 章 主要 讲解 了 如 何 实现 一 个 基本 的 内 容 管 理 框架 ， 其 中 包含 最 基本 的 后 台 项 目 搭建 、 基 础 模板 布局 、 


9.2 ”基础 异 板 布局 


有 与 普通 开发 框架 相当 的 灵活 性 、 扩 
。 这 使 得 很 多 项 目的 功能 不 需要 重新 开发 ， 减 少 了 工作 量 ， 提 高 了 


发 的 效率 。 


本 节 主 要 讲解 如 何 实现 基础 模板 布局 ， 不 仅 为 后 面 的 功能 模块 开发 提供 样式 的 支持 ， 而 且 也 是 深入 理解 ThinkPHP 5 模板 特性 的 好 途径 。 


9.2.1 准备 工作 


在 后 面 的 演示 实例 中 , 使 


1. 创 建 项 


使 


Composer 创 建 ThinkPHP 5 项 


， 命 名 为 wangcmf， 作 为 内 容 管理 框架 的 实例 进行 演示 。 使 ， 


ThinkPHP 5 作为 基础 框架 ，AdminLTE 模 板 风格 为 默认 样式 ， 进 行 准备 工作 的 步骤 如 下 。 


慨 性 ， 而 且 还 包含 了 常用 的 内 容 组 件 、 完 整 的 后 台 管理 模块 ， 如 用 户 模块 、 权 限 模块 与 配置 模块 


户 登录 与 验证 和 基于 无 限 分 类 的 菜单 模块 等 内 容 。 


命令 行 在 application 目 录 下 创建 admin 目 录 ， 上 


ler (控制 器 ) 、validate (数据 验证 ) 和 view (模板 展示 ) 三 个 


contro 


录 ， 在 admin 下 新 增 config.php 配 置 文件 。 


ThinkPHP 5 框架 初始 化 的 步骤 ,读者 可 以 参考 第 8 章 ， 这 里 不 再 袭 述 。 


2 新 建 静态 资源 目录 并 引入 第 三 方 类 库 


来 开发 后 台 管理 模块 。 在 admin 目 录 下 ， 默 认 新 建 


开发 后 台 管 理 模块 需要 引入 AdminLTE 模 板 样式 类 库 ， 所 以 在 项 目 根 目录 ， 进 入 public 目 录 下 的 static (静态 资源 ) 目录 中 ， 创 建 admin 目 录 ， 随 后 根据 习惯 ， 创 建 下 面 各 个 资源 目录 。 


“ libs: 存放 第 三 方 类 库 ， 如 Bootsttap 框 架 和 AdminLTE 有 后台 模块 样式 源 文件 等 。 


“css: 存放 CSS 样 式 表 文 件 。 
“ js; 存放 JavaScript 脚 本 文件 。 


“ images: 存放 静态 图 片 资源 文件 。 


以 上 几 个 目录 中 ， 目 前 只 需要 在 libs 目 录 中 ， 引 入 AdminLTE 类 库 相 


9.2.2 ”创建 基础 布局 模板 


基础 布局 模板 可 以 使 用 ThinkPHP 5 


带 的 模板 继承 与 模板 引入 来 实现 。 模 板 继承 是 一 项 更 加 灵活 的 模板 布局 方式 ， 它 不 同 


其 他 目录 预 留 暂 不 使 用 。 


关 文 件 (目录 命名 为 adminlte) 即 可 ， 


然后 继承 (extend) 该 基础 模板 的 子 模板 就 可 以 对 基础 模板 中 定义 的 区 块 进行 重 载 。 


模板 引入 ， 它 可 以 定义 一 个 基础 布局 模板 ， 并 且 定 义 相关 区 块 (block) ， 


下 面 讲解 如 何在 wangcmf 演 示 实 例 中 ， 实 现 基础 模板 布局 。 


1 .编写 基础 模板 布局 文件 layout.html 


在 项 目的 application\admin\view 下 ， 新 建 basic 目 录 ， 随 后 新 建 layout.html 文 件 。 编 写 代码 如 下 : 


{include file='basic:header'/} <!-- 引入 顶部 公共 模板 文件 --> 
{include file='basic:menu'/} <!-- 引入 菜单 公共 模板 文件 --> 
{include file='basic:nav'/} <!-- 引入 导航 公共 模板 文件 --> 


<!-- Content Wrapper. Contains page content --> 
<div class="content-wrapper"> 
<!-- Content Header (Page header) --> 

<section class="content-header"> 

<h1> 


{block name="page header"} 
<!-- 模板 继承 :页面 标 题 --> 
{/block} 
<small> 
{block name="page header small"} 
<!-- 模板 继承 ， 页面 副 标题 --> 
{/block} 
</small> 
</h1> 
<ol class="breadcrumb"> 
{block name="nav tips"} 


<!-- 模板 继承 ;导航 提示 --> 


{/block} 
</ol1> 
</section> 
l== Maln content 一 一 > 


<section class="content container-fluid"> 
<!-- 定义 全 局 成 功 提示 信息 框 --> 
<div id="showSuccessTips" class="callout callout-success" style=" 
display: none;"> 
<h4> 成 功 ! </h4> 
<p></p> 
</div> 
<!-- 定义 全 局 失败 提示 信息 框 --> 
<div id="showErrorTips" class="callout callout-danger" style=" 
display: none;"> 
<h4> 错 误 ! </h4> 
<p></p> 
</div> 
{block name="content"} 


<!-- 模板 继承 ， 定 义 主体 内 容 --> 


{/block} 
</section> 
<!-- /.content --> 
</div> 
<!-- /.content-wrapper --> 


{include file='basic:footer'/} <!-- 引入 底部 公共 模板 文件 --> 
{block name="'script'} 


<!-- 模板 继承 : 定义 JavaScript 脚 本 文件 --> 


{/block} 
</body> 
</html> 
基础 模板 布局 文件 中 使 用 了 AdminLTE 自 带 的 starter.html 示 例文 件 布局 ， 使 用 了 如 下 基本 的 模板 引入 命令 : 


{include file='basic:header'/} <!-- 引入 顶部 公共 模板 文件 --> 
{include file='basic:menu'/} <!-- 引入 菜单 公共 模板 文件 --> 
{include file='basic:nav'/} <!-- 引入 导航 公共 模板 文件 --> 


另外 ， 还 在 部 分 区 域 使 


模板 继承 ， 例 如 页 面 主体 中 的 标题 和 副标题 ， 在 基础 模板 布局 文件 中 默认 为 空 ， 这 样 就 保证 子 模板 继承 使 


时 ， 只 会 继承 样式 结构 ， 而 非 固定 的 内 容 : 


<section class="content-header"> 
<h1> 
{block name="page header"} 
<!-- 模板 继承 :页 面 标题 --> 
{/block} 
<small> 
{block name="page header small"} 
<!-- 模板 继承 ， 页 面 副 标题 --> 
{/block} 
</small> 


2. 定 义 公共 模板 头 文件 : header.html 


在 基础 模板 布局 文件 中 ， 可 以 发 现 引 入 了 很 多 其 他 模板 文件 ， 实 现 模板 的 分 区 管理 。 头 文件 主要 


来 定义 格式 类 库 和 基本 样式 。 在 basic 目 录 下 新 建 headerhtml 文 件 ， 核 心 代码 如 下 : 


<!DOCTYPE html> 

<html> 

<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<title>{:config('SITES NAME') }</title> 
<!-- Tell the browser to be responsive to screen width --> 
<meta content="width=device-width, initial-scale=1, maximum-scale=1, 
user-scalable=no" name="viewport"> 
<link rel="stylesheet" href="_ STATIC /admin/libs/adminlte/bower_ 
components/bootstrap/dist/css/bootstrap.min.css"> 
<!-- Font Awesome 一 -> 
<link rel="stylesheet" href=" STATIC /admin/libs/adminlte/bower_ 
components/font-awesome/css/font-awesome.min.css"> 
*l-—~ Tonioons 一 -> 
<link rel="stylesheet" href="__STATIC /admin/libs/adminlte/bower_ 
components/Ionicons/css/ionicons.min.css"> 
<!-- Theme style --> 
<link rel="stylesheet" href=" STATIC /admin/libs/adminlte/dist/css 
/AdminLTE .min.css"> a ed 


Cl er 3 > 
<script src=" STATIC /admin/libs/adminlte/bower components/jquery/ 
dist/jquery.min.js"></script> 
<script src="__STATIC /admin/js/common.js"></script> 
<script src=" STATIC /admin/js/submit.js"></script> 
</head> 加 


模板 文件 主 引入 了 AdminLTE 的 类 库 文件 : 


<link rel="stylesheet" href=" STATIC /admin/libs/adminlte/dist/css/ 
AdminLTE .min.css"> 


也 引入 了 内 容 管 理 框架 本 身 公共 脚 本 文件 ， 此 时 可 以 先 在 js 目录 下 手动 创建 两 个 空 JavaScript 脚 本 文件 ， 便 于 开发 者 编写 后 续 的 自 定义 脚本 样式 : 


<script src="_ STATIC /admin/js/common.js"></script> 
<script src="_ STATIC /admin/js/submit.js"></script> 


3. 定 义 顶部 导航 公共 模板 文件 : nav.html 


顶部 导航 定义 了 三 部 分 内 容 ， 主 要 展示 和 实现 以 下 功能 : 


“ 站 点 信息 ， 后 台 管 理 站 点 的 名 称 展 示 ， 使 用 ThinkPHP5 助 手 方法 config () 读 取 。 
“ 顶部 导航 ， 展 示 顶 级 导航 信息 。 


: 用 户 信息 ， 展 示 用 户 ID、 用 户 名 和 注销 登录 等 操作 入 口 。 


继续 使 用 AdminLTE 模 板 样式 ， 定 义 核心 代码 如 下 : 


<body class="hold-transition skin-blue sidebar-mini"> 
<div class="wrapper"> 


<!-- Main Header --> 
<header class="main-header"> 
i Dog > 


<a href="/admin" class="l0go"> 
<!-- 读 取 后 台 管 理 站 点 名 称 PC 模式 --> 
<span class="logo-mini">{:config('SITES NAME') }</span><!-- 使 用 


助手 方法 读 取 --> 
<!-- 读 取 后 台 管 理 站 点 名 称 移动 端 模式 --> 
gn>{f:config('STTES_NAME ') }</span><!-- 使 用 助 


<span Class="1og' 
手 方法 读 取 --> 
</a> 
<!-- 顶部 导航 --> 
<nav class="navbar navbar-static-top" role="navigation"> 
<!-- Sidebar toggle button--> 
<a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button"> 
<span class="sr-only">Toggle navigation</span> 
</a> 
<!-- 一 级 导航 --> 
<ul class="nav navbar-nav"> 
<1i class=""><a href=""> 导 航 名 </a></1i> 
</ul> 
<!-- 登录 用 户 会 话 信息 展示 --> 
<div class="navbar-custom-menu"> 
<ul class="nav navbar-nav"> 
<!-- User Account Menu --> 
<1i class="dropdown user user-menu"> 
<!-- Menu Toggle Button --> 
<a href="#" class="dropdown-toggle" data-toggle=" 
dropdown"> 
<!-- 显示 用 户 名 --> 
y <span class="hidden-xs"> 测 试用 户 名 </span> 
</a> 


测试 ID</p> 
亏 <p> 用 户 名 : 测试 用 户 名 </p> 
< 


jy 
<!-- 用 户 操作 区 域 --> 
<1i class="user-footer"> 
<div class="pull-left"> 


</div> 
<div class="pull-right"> 
<a href="{:url('public user/logout')}" class= 
"btn ptn-default btn-fIat"> 注 销 登 录 </a> 
</div> 
</1i> 
</ul> 
</1i> 
</ul> 
</div> 
</nav> 
</header> 


4. 新 建 左 侧 菜单 组 基础 模板 文件 : menu.html 


用 户 选 择 顶 部 的 一 级 菜单 后 ， 左 侧 菜单 组 会 显示 当前 分 类 下 的 二 级 分 类 ， 在 basic 目 录 下 新 建 menu.html 文 件 ， 核 心 代码 如 下 : 


<aside class="main-sidebar"> 
sidebar"> 
菜单 组 --> 
<ul class="sidebar-menu" data-widget="tree"> 
<1i class="header"> 导 航 </1i> 
<1i class="treeview active"> 
<a href="#"><i class="fa fa-link"></i> <span> 菜 单 组 </span> 
<span class="pull-right-container"> 
<i class="fa fa-angle-left pull-right"></i> 
</span> 
</a> 
<ul class="treeview-menu"> 
<1i class="active"> 
<a href="/"> 菜 单 组 内 容 </a> 


</1i> 
</ul> 
</1i> 
</ul> 
</section> 


</aside> 


5. 定 义 底部 基础 模板 文件 : footer.html 


此 文件 用 来 引入 公共 的 Javascript 类 库 文件 ， 底 部 引入 的 方式 可 以 让 脚本 的 载 入 不 影响 样式 的 预先 加 载 。 核 心 代码 定义 如 下 : 


<footer class="main-footer"> 
<div class="pull-right hidden-xs"> 


布局 底部 说 明 

</div> 

<strong>Copyright &copy; 2018 <a href="#">Company</a>.</strong> 权限 说 明 . 
</footer> 
< 一” ‘Bontetrap 3.3.7 =—> 
<script src="_ STATIC /admin/libs/adminlte/bower components/bootstrap/dist/js/bootstrap.min.js"></script> 
<!-- RdminLTE App --> 
<script src="_ STATIC_ /admin/libs/adminlte/dist/js/adminlte.min.js"></script> 


6 .测试 基础 模板 布局 文件 


在 完成 以 上 几 个 步骤 后 ， 为 了 测试 基础 模板 样式 ， 先 在 application\admin\controller 目 录 下 找到 index.php 控 制 器 文件 ， 修 改 index () 方法 如 下 : 


// 测试 基础 模板 布局 文件 
public function index() 
return Sthis->fetch () 7 
} 


再 在 application\admin\view 下 新 增 index 目 录 ， 创 建 模板 文件 index.html 文 件 ， 然 后 使 


extend 和 block 标 签 实现 模板 的 继承 操作 ， 核 心 代码 如 下 : 


{extend name="basic:1layout"} 
{block name="page header"} 
标题 
{/block} 
{block name="page header small"} 
副标题 - 
{/block} 
{block name="content"} 

显示 表单 、 列 表 等 
{/block} 


在 浏览 器 中 访问 地 址 : http://wangcmf.com/admin/index/index， 发 现 主体 内 容 已 经 展示 为 自 定义 的 形式 ， 效 果 如 图 9-9 所 示 。 


超级 管理 员 后 台 


标题 副 村 所 


121212121 


人 提示 : 域名 http://wangcmf.com 为 本 地 虚拟 域名 ， 开 发 者 可 以 自行 配置 与 定义 。 


9.3 ”用 户 模块 一 一 用 户 登 录 与 验证 


户 权限 的 控制 ， 比 常见 的 网 站 系统 更 严格 ， 除 了 登录 和 注销 登录 功能 页 外 ， 


后 台 管理 模块 对 于 


9.3.1 ”数据 结构 设计 与 基础 模板 开发 


9-9 后台 管理 模板 基础 布局 效果 


用 户 ID: 测试 ID 
用 户 名 : 测试 用 户 名 


都 不 能 在 未 登录 状态 下 访问 网 站 。 本 节 重 点 讲解 


户 登 录 会 话 验证 机 制 ， 如 


新 用 户 通 过 后 台 添 加 或 者 前 台 注册 才能 访问 网 站 ， 所 以 实现 内 容 开 发 系统 的 第 一 步 ， 就 需要 实现 


户 模块 的 登录 功能 。 


图 9-10 所 示 。 


下 面具 体 介绍 该 功能 的 实现 步骤 。 


1 数据 表 设 计 


新 建 数据 库 wangcmf， 新 建 用 户 表 user ( 表 前 缀 db_ ) ， 以 手机 号 (mobile) 作为 


户 登 录 的 唯一 标识 ， 密 码 (password) 存储 的 字符 


9-10 用 户 登 录 会 话 验 证 机 制 


使 用 md5 序 列 化 ， 其 他 字段 可 以 参见 结构 说 明 。 代 码 如 下 : 


CREATE TABLE ‘db user ”人 ( 
`id int(10) NOT NULL AUTO INCREMENT, 
‘name. varchar(255) NOT NULL DEFAULT '', 
“status、int (10) NOT NULL DEFAULT '0' COMMENT '-1: 已 删除 ，0: 禁用 ，1: 正常 '， 
“create time”jint (10) NOT NULL DEFAULT '0' COMMENT ' 创 建 时 间 '， 
“update time”int (10) NOT NULL DEFAULT '0' COMMENT ' 更 新 时 间 '， 
`type ”tinyint (2) NOT NULL DEFAULT '0' COMMENT '0: 普通 用 户 ，1: 管理 员 '， 
“mobile、varchar (20) NOT NULL DEFAULT '' COMMENT ' 手 机 号 ， 唯 一 性 标 i 
“password”varchar (255) NOT NULL DEFAULT '' COMMENT ' 密 码 '， 
PRIMARY KEY (‘id*) USING BTREE, 
UNIQUE KEY ‘mobile” (“mobile*) USING BTREE COMMENT ' 手 机 号 
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 ROW FORMAT=COMPACT; 


:能 重复 


因为 目前 还 没有 用 户 管理 模块 ， 所 以 手动 在 数据 库 中 插入 一 个 测试 用 户 数据 ， 如 图 9-11 所 示 。 
Modify id name | status | create_time update_time type | mobile password 
编辑 |1 |wangjialin| 1 0 0 10 13511112222| 14elb600blfd579f47433b88e8d85291 | 


9-11 


需要 说 明 的 是 ， 记 录 中 password 的 值 是 根据 以 上 PHP 代码 生成 的 : 


在 数据 表 中 插入 测试 数据 


echo md5 (md5 ('"123456") )7 


2. 登 录 表 单 模板 


在 application\adminNcontroller 目 录 下 新 建 PublicUser.php 控 制 器 文件 ， 文 件 继承 自 ThinkPHP 的 控制 器 类 ， 新 建 login () 和 logout () 方法 ， 分 别 用 来 展示 


体 步 又 如 下 : 


(1) 新 建 控制 器 类 


户 登 录 页 面 和 执行 注销 登录 页 面 。 


/x* 


Wi 登录 、 注 销 操作 类 


Class PublicUser extends Controller 
{ 


/** 


* 用 户 登 录 
a 


Public function login() 

{ 
//Todo: :显示 用 户 登 录 表单 
return $this->fetch(); 


public function logout (){ 
//Toqo: :执行 注销 用 户 操作 
} 
} 


(2) 新 增 


登录 模板 


AdminLTE 提 供 了 注册 登录 的 示例 样式 ， 这 里 直接 拿 来 使 用 。 在 application\admin\view 下 新 建 public_user 目 录 ， 在 其 中 增加 login.html 文 件 。 其 核心 代码 如 下 : 


01 <!-- 登录 提交 到 1ogin 方 法 --> 


02 <form action="{:url('PublicUser/login')}" method="post"> 
03 <div class="form-group has-feedback"> 
04 <input type="text" name="mobile" class="form-control"placeholder= 
"手机 号 " value="{S$data.mobile|default="''}"> 
i </div> 
06 <div class="form-group has-feedback"> 
07 <input type="password" name="password" class="form-control™" 
Placeholder=" 密 码 "> 
08 </div> 
09 <div class="row"> 
10 <div class="col-xs-4"> 
11 <!-- 表单 提交 --> 
12 <button type="submit" class="btn btn-primary btn-block 
btn-flat" 
> 登 录 </button> 
13 </div> 
14 </div> 
15 <div class="row"> 
16 <div class="col-xs— 
i <!-- 显示 错误 提示 
18 {$show error tips|ldefault="'"'} 
ui </div> 
20 </div> 
21</form> 
9.3.2 ”完成 用 户 登录 操作 


为 了 处 理 登 录 表 单 页 提交 的 请 求 数据 ， 修 改 login() 方法 ， 增 加 以 下 代码 ， 


来 实现 对 POST 请 求 数据 的 处 理 : 


public function login() 


// 判断 是 否 是 用 户 提交 
if (request () ->isPost () ) 
{ 
// 获取 POST 提 交 的 数据 
$data = input ('post.'); 
// 表单 提交 数据 验证 
$checkResult = $this->checkFormData ($data); 
if($checkResult !== '') 


// 显示 错误 信息 
$this->assign('show error tips' , $checkResult); 


// 在 表单 中 展示 上 一 次 的 提交 数据 
$this->assign('data' , $data); 
// 执行 登录 操作 
if(!$this->doLogin ($data)) 
bi 
$this->assign('show error tips' ，' 用 户 名 或 者 密码 错误 '); 
} 
else 
{ 
Sthis->success (' 登 录 成 功 ' ，url ('index/index')); 
于 
return $this->fetch () 


在 代码 中 ， 使 用 checkFormData () 方法 ， 封 装 ThinkPHP 5 自 带 的 验证 类 (Validate) 方法 ， 来 验证 用 户 输入 的 手机 号 和 密码 是 否 格 式 正确 。 核 心 代码 定义 如 下 : 


六 大 
* 验证 表单 提交 数据 
* @param $data 
* @return array|string 
wd 
public function checkFormData ($data) 
{ 
// 表单 验证 规则 


Srule = [ 
'mobile' => 'require|lregex:\d{11}', 
"Password' => 'require|lmax:25|min:6', 
]; 
Smsg = [ 


'mobile.regex' => ' 手 机 号 格式 错误 '， 
'password.require' =>' 密 码 不 能 为 空 ' 


// 手机 号 字段 验证 错误 提示 文本 
// 密码 字段 验证 错误 提示 文本 


// 使 用 内 置 的 验证 类 
// 执行 验证 操作 


// 验证 失败 ， 返 回 验 证 信息 


]; 
S$validate = new Validate ($rule , $msg); 
$result = $validate->check ($data); 
if(!$result){ 

return $validate->getError(); 
} 


return ''; 


// 不 能 为 空 | 正则 验证 :必须 为 11 位 数字 
// 不 能 为 空 | 最 大 长 度 为 25 位 | 最 小 长 度 为 6 位 


在 表单 提交 数据 的 格式 验证 通过 后 ， 执 行 控制 器 的 doLogin () 方法 实现 在 数据 库 中 检索 是 否 存 在 此 用 户 ， 同 时 验证 用 户 输入 的 密码 是 否 正确 。 方 法 定义 如 下 : 


private function doLogin($data) 


if(!empty ($data)) 
{ 


// 构建 查询 数据 

Smap = [ 
"mobile' => $data['mobile'], 
'password' => sys_md5 ($data['password']), 
'status' =>1 


] 7 

// 查询 用 户 是 否 存在 

$user info = Db::name('user')->field('id as user id,name,mobile') 
->where ($map) ->find (); 

// 车 查询 不 到 用 户 则 返回 false 


if ($user info === null) 


return false; 
} 
// 记录 会 话 信息 
session('user auth' , $user info); 
return true; 


} 
return false; 


此 方法 对 用 户 输入 的 参数 进行 数据 库 检索 ， 根 据 检索 返回 值 判 断 是 否 返 回 true 或 者 false。sys_md5 () 的 方法 定义 在 application\common.php 文 件 中 ， 定 义 如 下 : 


if(!function exists('sys md5')) 


// 系统 密码 加 密 方 法 
function sys_md5 ($string) 
{ 


return md5 (md5 ($string)); 


9.3.3 ”用 户 登录 状态 验证 与 注销 登录 
完成 功能 代码 的 开发 ， 这 里 进行 功能 的 使 用 与 测试 ， 查 看 用 户 登录 功能 是 否 可 以 正常 地 使 用 。 成 功 登 录 后 ， 需 要 记录 和 验证 用 户 的 会 话 状态 ， 同 时 还 需要 提供 注销 登录 的 相关 方法 。 
1. 使 用 登录 功能 
在 浏览 器 中 访问 地 址 : http://wangcmf.com/admin/public_user/login.html， 输 入 错误 的 手机 号 码 和 密码 ， 展 示 效 果 如 图 9-12 所 示 。 


随后 输入 正确 的 手机 号 、 密 码 后， 提示 登录 成 功 ， 如 图 9-13 所 示 。 


12311112222 


图 9-12 ”对 错误 的 信息 进行 提示 


图 9-13 ThinkPHP 5 自 带 的 成 功 提 示 页 面 


2. 替 换 系统 提示 跳 转 页 的 模板 


使 用 系统 自 带 的 success () 方法 ， 会 自动 调用 ThinkPHP 5 默认 页 面 重 定向 模板 样式 ， 为 了 实现 效果 的 统一 ， 这 里 修改 为 自 定 义 样式 。 


首先 在 basic 公 共 模 板 文件 夹 下 ， 新 增 success.html 和 error.html， 以 success.html 模 板 为 例 ， 核 心 代码 如 下 : 


<div class="error-content"> 
<h3><i class="fa text-yellow"></i><?php echo (strip tags ($msg));?></h3> 
<p> 
页 面 自动 <a id="href" href="<?php echo ($url);?>"> 跳 转 </a> 等 待 时 间 : ”<b 
id="wait"><?php echo ($wait);?></b> 
</p> 


<form class="search-form"> 
<div class="input-group"> 
<input type="text" name="search" class="form-control" 
placeholder=" 搜 索 "> 
<div class="input-group-btn"> 
<button type="submit" name="submit" class="btn btn-warning 
btn-flat"><i class="fa fa-search"></i> 
</button> 
</div> 
</div> 
<l-—— /input-group -——> 
</form> 
</div> 


随后 在 application\admin\config.php 文 件 中 ， 定 义 信息 提示 模板 的 位 置 为 自 定义 : 


<?2php 

return [ 
// 默 认 跳 转 页 面 对 应 的 模板 文件 
"dispatch_success_tmp1' => 'basic/success', 
'dispatch error tmpl' => 'basic/error', 


]; 


执行 登录 操作 ， 效 果 如 图 9-14 所 示 。 


登录 成 功 


Dn I 页 面 自动 跳 转 等 待 时 间 : 3 


图 9-14 自 定 义 跳 转 提 示 模 板 样 式 


3. 用 户 登录 会 话 验 证 

完成 上 述 步骤 后 ， 用 户 登录 就 可 以 正常 执行 了 。 不 过 还 存在 以 下 几 个 问题 : 
“ 用 户 登 录 后 ， 登 录 页 还 可 以 访问 ， 实 现 重复 登录 。 

:用户 未 登录 ， 也 可 以 访问 后 台 管理 首页 文件 。 

“ 用 户 登 录 后 ， 无 法 确认 当前 登录 的 是 哪个 用 户 。 


为 解决 这 些 问题 ， 需 要 在 application\common.php 下 ， 定 义 用 户 是 否 登录 的 公共 检测 方法 is login () ， 代 码 如 下 : 


// 应 用 公共 文件 


if(!function exists('is login')) 


// 检测 用 户 是 否 已 经 登录 
function is 1ogint 和 
// 获取 会 话 中 的 用 户 信息 
$user = session('user auth') 
// 若 不 存在 ， 则 返回 0。 尖 届 投向 让: 信 息 
if (empty($user)) { 
return 0; 


return $user; 


完成 后 ， 修 改 PublicUser 控 制 器 的 login () 方法 ， 增 加 登录 状态 判断 ， 若 用 户 已 经 登录 ， 系 统 会 自动 跳 转 到 Index 控 制 器 的 index () 方法 。 代 码 如 下 : 


public function login() 


// 登录 后 不 能 再 进入 登录 页 
if(is login()) 
. 
$this->redirect ('index/index'); 


随后 在 application\admin\controller 目 录 下 ， 新 增 Admin.php 控 制 器 文件 ， 此 控制 器 作为 其 他 控制 器 的 父 类 ， 在 初始 化 方法 中 进行 用 户 是 否 登录 的 判断 。 核 心 代码 如 下 : 


class Admin extends Controller 


// 初始 化 方法 
protected function initialize() 
{ 


parent:: initialize(); 


// 在 会 话 中 检测 USER_ID 
if(!defined('USER ID')) 
{ 
define ('USER ID',is login()); 


/7/ 还 没 登录 人 
if( !USER_ ID 
Sthis- en public user/login'); 


此 时 再 去 测试 ， 用 户 在 未 登录 状态 下 访问 首页 和 已 登录 状态 下 访问 登录 页 ， 就 会 有 相应 的 跳 转 和 提示 了 。 


4 .在 导航 条 信息 上 展示 用 户 会 话 信息 


用 户 登录 后 会 在 会 话 中 记录 用 户 信息 。 修 改 application\admin\view\basic\nav.html 文 件 ， 在 模板 中 展示 会 话 信息 。 代 码 如 下 : 


<li class="dropdown user user-menu"> 
<!-- Menu Toggle Button --> 
<a href="#" class="dropdown-toggle" data-toggle="dropdown"> 
<!-- 显示 用 户 名 --> 
<span class="hidden-xs">{:session('user auth.name') }</span> 
</a> 
<ul class="dropdown-menu"> 
<!-- 显示 用 户 详细 信息 --> 
<1Li class="user-header" style="height: 100px;"> 
<p> 用 户 ID: {:session('user auth. user ee )}</p> 
<p> 用 户 名 : {:session('user auth.name') }</p> 
</1i> 


在 登录 状态 下 ， 后 台 导 航 用 户 信息 展示 如 图 9-15 所 示 。 


wangjlalin 


用 户 ID: 1 


用 户 名 : wangijialin 


图 9-15 展示 当前 登录 的 用 户 信息 


修改 application\admin\view\basic\nav.html 文 件 ， 在 用 户 信息 展示 区 域 下 ， 提 供 新 的 注销 登录 的 地 址 : 


<div class="pull-right"> 
<a href="{ :Url ('public user/logout')}" class="btn btn-default btn- 
flat"> 注 销 登录 </a> 

</div> 


在 PublicUser 控 制 器 文件 中 修改 logout () 方法 ， 代 码 如 下 : 


public function logout(){ 

session('user auth', null); 

Sthis->success (' 退 出 成 功 ! ',url('public user/login')); 
} 


执行 注销 登录 后 ， 页 面 自动 重 定向 到 登录 页 ， 提 示 如 图 9-16 所 示 。 


图 9-16 ”执行 注销 登录 操作 


9.4 ”菜单 模块 


后 台 管 理 系统 中 ， 各 功能 的 使 用 需要 莱 单 ， 权 限 判 定 也 需要 菜单 。 所 以 首先 开发 菜单 模块 ， 不 仅 能 为 后 面 的 权限 模块 打下 基础 ， 也 可 以 让 开发 者 更 好 地 理解 这 些 模块 的 作用 和 联系 。 


9.4.1 ”数据 结构 设计 


第 一 级 菜单 位 于 顶部 导航 条 上 ， 这 类 菜单 代表 功能 的 合集 ， 如 用 户 和 系统 等 菜单 。 而 每 个 顶级 菜单 下 又 包含 二 级 菜单 。 这 类 菜单 在 页 面 的 左 侧 展 示 ， 一 般 由 列表 和 特殊 单 页 组 成 ， 例 如 用 户 列表 、 权 限 
9-17 所 示 。 


分 组 列表 和 数据 库 备 份 单 页 等 ， 如 图 


标题 副 标 昨 


显示 表单 、 列 表 等 


9-17 一 级 菜单 和 二 级 菜单 


除了 可 视 化 的 菜单 外 ， 还 有 一 些 隐 性 的 操作 菜单 (三 级 菜单 ) 经 常 被 使 用 ， 例 如 : 


“ 数据 的 增加 、 删 除 等 操作 ; 


. AJAX 操 作 方法 ; 


“ 带 特定 参数 请 求 的 URL 


为 了 能 够 让 用 户 使 用 菜单 ， 需 要 和 具体 的 


以 用 户 模块 为 例 ， 典 型 的 


拥有 此 功能 的 权限 ， 则 直接 不 显示 此 菜单 ， 


控制 器 方法 关 


闫 。 每 个 菜单 项 都 对 应 一 个 方法 ， 每 个 方法 又 对 应 一 个 功能 。 这 样 就 可 以 针对 菜单 进行 权限 控制 。 例 如 ,菜单 中 有 用 户 列表 这 一 项 ， 若 不 希望 某 


或 设置 对 此 


菜 和 


分 


用 户 列表 二 级 菜单 ) 


屋 关 系 图 


操作 无 效 即 可 。 


如 图 9-18 所 示 。 


用 户 《 项 级 荣 单 ) 


分 组 列表 二 级 菜单 ) 


新 增 用 户 〈 操 作 菜 单 ) 启用 /禁用 /删除 用 户 《 操 作 ) 分 组 管理 (操作 菜单 ) 用 户 授 权 〔 操 作 菜 单 ) 


9-18 ”菜单 分 层 关系 图 


根据 上 述 需求 ， 在 设计 菜单 结构 时 可 以 参考 无 限 分 类 设计 原则 。 其 思路 是 : 所 有 的 分 类 都 存储 在 一 张 表 中 ， 每 一 级 分 类 的 id 和 其 父 级 分 类 pid 关 联 ， 根 据 内 查询 判断 分 类 级 别 ， 理 论 上 可 以 无 限 向 下 扩 


展 。 


实际 设计 中 ， 一 级 分 类 的 pid 字 段 值 为 0， 因 


为 一 级 分 类 没有 父 分 类 。 二 级 分 类 的 pid 为 一 级 分 类 的 id， 子 分 类 再 以 此 类 推 实现 无 限 分 类 (不 过 通常 到 第 三 级 就 够 用 了 ) 。 


根据 上 述 原则 设计 菜单 表 (db_menu) ， 其 字段 说 明 如 表 9-1 所 示 。 


表 9-1 菜单 表 (db_menu) 字段 说 明 


列 (字段) 
id 
title 
pid 
sort 
url 
hide 
tip 
group 
is_dev 


status 


9.4.2 ”获取 菜单 数据 列表 


为 了 方便 演示 ， 先 增加 一 些 测试 菜单 数据 ， 


类 型 
int(10) unsigned 自动 增 量 
varchar(50) [] 

int(10) unsigned [0] 
int(10) unsigned [0] 
char(255) [] 

tinyint(1) unsigned [0] 
varchar(255) [] 
varchar(50) NULL [] 
tinyint(1) unsigned [0] 
tinyint(1) [0] 


上 
用 


注意 菜单 的 pid 与 id 的 对 应 关系 ， 如 图 9-19 所 示 。 


User/index 
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图 9-19 ”手动 增加 测试 菜单 数据 


在 测试 数据 中 ， 定 义 了 三 个 一 级 菜单 在 导航 条 上 展示 : 首页 、 


户 和 系统 。 系统 菜单 下 又 分 为 网 站 设置 、 配 


管理 和 菜 


管理 三 个 菜 


菜单 管理 增加 了 一 些 操作 菜单 (三 级 菜单 ) ， 如 增 、 删 、 改 、 查 等 操作 。 


实现 读 取 菜单 分 类 信息 并 展示 的 步骤 如 下 。 


1. 获 取 菜单 分 类 信息 


在 application\admin\controller 中 修改 admin.php 控 制 器 文件 ， 定 义 getMenus() 方法 获取 菜单 的 树 形 结构 。 其 核心 代码 如 下 : 


。 注 意 ， 这 三 个 二 级 菜单 拥有 同样 的 分 组 名 : 系统 设置 。 最 后 给 


/** 
人 二 级 菜单 元 素 位 于 一 级 菜单 的 '_child' 元 素 中 


public function getMenus ($controller=CONTROLLER NAME) { 
// 会 话 中 是 否 已 经 存在 菜单 


Smenus = session('ADMIN MENU LIST.'.$controller); 
if (empty ($menus)){ 
// 获取 一 级 菜单 
S$where['pid'] 
S$where['hide'] 
$menus['main'] 


07 
0; // 默认 显示 
Db: :name ('menu') ->where ($where) ->order ('sort 
asc')->field('id, title, url')->select (); // 数据 查询 
Smenus['childq'] =  []; // 设 置 二 级 菜单 子 节点 
foreach ($menus['main'] as $key => $item) { 
if (strtolower (CONTROLLER NAME.' bi .ACTION NAME) 
($item['url'])){ 
$menus['main'] [$key] ['class']='active'; // 菜单 是 否 添加 选中 状态 
} 


} 
// 查找 当前 子 菜单 
$pid = Db: :name('menu')->where ("pid !=0 AND Url like '% 
{$controller}/".ACTION NAME."%'")->value ('pid'); 
if ($piqd) { 
// 查找 到 当前 一 级 菜单 
$nav = Db::name('menu')->find($pid); 
if ($nav['pid']){ 


= strtolower 


Snav = Db: :name ('menu')->find ($nav['pid']); 
} 
foreach ($menus['main'] as $key => $item) { 
// 获取 当前 主 菜单 的 子 菜单 项 
if($item['id'] 一 $nav['id']){ 
$menus['main'] [$key] ['class']='"active'; 
// 生 成 子 菜单 《child) 树 
S$groups_list = Db: :name ('menu') 
->field('group') 
->where (array ('group'=>array ('neq', ''), 'pid' =>$item 
["id'])) 
->distinct (true) 
->select () 7 
$groups = []; 
foreach ($groups_ list as $k=>$v) 
$groups[] = $v['group']; 


} 
// 获 取 二 级 分 类 的 合法 url 
S$where = []; 
S$where['pid'] Sitem["id']7 
S$where['hide'] 07 
$second urls = Db: :name ('menu')->where ($where) ->column 
i 
// 按照 分 组 生成 子 菜 单 树 
foreach ($groups as $9g) { 
Smap = array ('group'=>$g); 
if (isset ($to check urls)){ 
if (empty ($to check urls)){ 
// 没有 任何 权限 


continue; 
}else{ 
Smap['url'] = array('in', $to check urls); 
} 
} 
$map['pid'] = $item['id']; 
$map['hide'] = [a 


SmenuList = Db::name ('menu')->where ($map)->field('iqd, 
pid,title,url,tip')->order ('sort asc')->select () 7 
S$menus['child'] [$g] = list to tree ($menuList, 'id', 
'pid', ‘operater', $item['id']); 


} 
} 


} 
// 菜单 数据 缓存 到 会 话 ， 减 少数 据 查询 ， 提 升 性 能 
session('ADMIN MENU LIST.'.$controller, $menus); 
} 
return $menus; 


} 


2. 查 看 菜单 数据 结构 


除了 登录 页 面 外 ， 后 台 页 面 都 有 菜单 展示 ， 所 以 需要 在 admin 控 制 器 初始 化 方法 时 查询 出 所 有 的 菜单 


修改 admin.php 控 制 器 的 initialize () 方法 ， 使 用 dump () 方法 打印 输出 getMenus () 方法 返回 


， 进 行 变量 的 模板 置换 。 


值 。 数 组 结构 如 下 : 


array(2) { 
["main"] => array(3) { 
0] => array(3) { 
"id"] => int (1) 
"title"] => string (6) "首页 " 
"url"] => string(11) "Index/index" 


1] => array(3) { 

"id"] => int (16) 

"title"] => string(6) "用 户 " 
"url"] => string(10) "User/index" 


2] => array(4) { 

"id"] => int (68) 

"title"] => string (6) "系统 " 
"url"] => string(10) "Menu/index" 
"class"] => string(6) "active" 


["child"] => array(1) { 
设置 "] => array(3) { 
> array(5) 1{ 
"id"] => int (69) 
int(68) 
> string(12) "网 站 设置 " 
=> string(12) "Config/group" 
=> string(0) "" 


array(5) { 

=> int (70) 

=> int (68) 

=> string (12) "配置 管理 " 

> string(12) "Config/index" 
=> string(0) "" 


[2] => array(5) { 

ni] = Lt ty 

"pid"] => int (68) 

=> string (12) "菜单 管理 " 
=> string(10) "Menu/index" 
=> string(0) "" 


9.4.3 ”后 台 菜 单 展示 


此 前 已 经 完成 了 基础 模板 布局 的 开发 。 要 进行 动态 的 菜单 展示 ， 还 需要 修改 以 下 几 个 地 方 : 


.admin 控制 器 的 初始 化 方法 ， 查 询 出 所 有 的 菜单 ， 并 进行 全 局 变量 模板 置换 。 
“ 利用 基础 模板 nav.html 动 态 展 示 一 级 菜单 。 
: 利用 基础 模板 menu.html 动 态 展示 二 级 菜单 。 

操作 步骤 如 下 : 


(1) 修改 admin 控 制 器 的 初始 化 方法 。 找 到 _initialize () 方法 ， 增 加 以 下 代码 : 


// 菜单 变量 置换 到 模板 中 


$this->assign('menu list' , $this->getMenus()); 


(2) 利用 nav.htm| 动 态 化 展示 导航 菜单 列表 。 找 到 一 级 导航 菜单 列表 代码 ， 修 改 如 下 : 


<!-- 一 级 导航 --> 
<ul class="nav navbar-nav"> 
{notempty name="menu list.main"} 
{volist name= menu list.main™ id="menu"} 
<1i class="{$menu.class|default=''}"><a href="{:url ($menu 
['url'])}">{$menu.title}</a></1i> 
{/volist} 
{/notempty} 
</ul> 


注意 : 以 下 代码 定义 了 导航 菜单 是 否 是 高 亮 状 态 : 


{$menu.class|default="''} 


(3) 利用 menu.html， 动 态 化 展示 二 级 菜单 列表 。 


<ul class="sidebar-menu" data-widget="tree"> 
<1i class="header"> 菜 单 组 </1i> 
{notempty name="menu list.child"} 
{volist name="menu list.child" id="sub menu"} 
<1i class="treeview {if condition='show menu active ($sub menu ， 
$active url) eq true'}active{/if}"> I 站 加 
<a href="#"><i class="fa fa-link"></i> <span>{$key}</span> 
<span class="pull-right-container"> 
<i class="fa fa-angle-left pull-right"></i> 
</span> 
</a> 
<ul class="treeview-menu"> 
{volist name="sub menu" id="menu"} 
<1i class="{if condition='$active Url eq $menu["url"]'} 
active{/if}"> 和 


<a href="{:url ($menu.url)}">{$menu.title}</a> 
</1i> 
{/volist} 
</ul> 
</li> 
{/volist} 
{/notempty} 


</ul> 


在 列表 循环 中 使 用 了 show_menu_active () 方法 ， 来 判断 当前 菜单 项 是 否 被 选中 ,在 application\common.php 中 ， 定 义 如 下 : 


function show_ menu_active ($sub menu, $active url) 
{ 
Sactive = false; // 是 否 选 中 
if (!empty($sub menu) && $active url) { 
foreach ($sub menu as S$key => $val) { 


if ($active url 一 $val['url']) { 
$active = true; 
break; 


} 
} 
lL 
return $active; 


} 


(4) 查看 菜单 效果 。 登 录 后 ， 查 看 菜单 是 否 正常 展示 ， 如 图 9-20 所 示 。 


超级 管理 员 后 台 


标题 副标题 


显示 表单 、 列 表 等 


图 9-20 动态 展示 管理 菜单 


9.4.4 菜单 管理 


菜单 管理 包含 菜单 列表 、 新 增 (编辑 ) 菜单 和 修改 菜单 状态 (状态 的 迁移 ) 3 部 分 。 


1. 菜 单列 表 


菜单 列表 使 用 AdminLTE 模 板 样式 ， 默 认 展示 一 级 菜单 ， 用 户 可 以 单 击 菜单 名 从 而 查看 当前 菜单 的 子 菜单 。 下 面 实现 步骤 。 


(1) 菜单 控制 器 与 列表 方法 


在 application\admin\controller 下 ,创建 Menu.php 菜 单 控制 器 类 文件 。 新 增 index () 方法 ， 用 来 展示 菜单 列表 。 核 心 代码 如 下 : 


/** 

* 菜单 管理 类 

* Class Menu 

* @package app\admin\controller 
*/ 


class Menu extends Admin 
{ 
本 大 
* 菜单 列表 
* @return mixed 
* @throws \think\exception\DbException 


本 
public function index () 


{ 
// 查询 条 件 


$map = []; 、 
$map['status'] = ['egt' , 0]; // 非 删除 记录 
Smap['pid'] = 0; // 一 级 菜单 
$pid = input ('pid' , 0); // 是 否 需 要 查看 下 级 分 类 
证 (Spid) 
时 

$map['pid'] = $pid; // 增加 菜单 查询 条 件 


} 

// 带 分 页 的 列表 查询 

$list = Db: :name ('menu') ->where ($map) ->order ('sort asc')-> 
Paginate (10); 

if ($list) 


// 变量 置换 


$this->assign(' list' , $list); 


} 

// 变量 置换 
$this->assign('pid' , $pid); 
return Sthis->fetch () 7 


相 比 ThinkPHP 3，ThinkPHP 5 的 分 页 功能 使 用 起 来 更 加 简单 ， 只 需要 一 个 方法 即 可 实现 。 代 码 如 下 : 


$list = Db::name ('menu')->where ($map) ->order ('sort asc')->paginate (10); 


(2) 菜单 类 列表 模板 


在 application\admin\view 下 创建 menu 目 录 ， 新 增 index.html 模 板 文件 。 实 现 列表 输出 的 核心 代码 如 下 : 


{notempty name=" list"} 


" list" id="vo"} 


<td>{$vo.id}</td> 
<td><a href="{:url('index' , ['pid'=>$vo.id])}">{$vo.title}</ 


a></td> 
<td>{$vo.pid|getParentMenuTitle}</td> 
<td>{$vo.group|ldefault='--'}</td> 


<td>{$vo.url}</td> 

<td>{$vo.status|lget status info}j</td> 

<td> 
<a href="{:url('edit', ['id'=>$vo['id']])}"> 编 辑 </a> 
{if condition='$vo["status"] eq 0'} 


<a class="ajax-get" href="javascript:;" url="{:url("' 
setMenuStatus', ['id'=>$vo['id'],'status'=>1]) }"> 启 用 </a> 
{else/} 
<a class="ajax-get" href="javascript:;" url="{:url(' 
setMenuStatus', ['id'=>$vo['id'],'status'=>0] ) }"> 禁 用 </a> 
{/if} 
<a class="ajax-get confirm" href="javascript:;" url="{:url 
('del', ['iqd'=>$vo['id"]])}"> 删 除 </a> 
</td> 
</tr> 
{/volist} 
{else /} 
<tr><td colspan="6" class="text-center"> 暂 无 数据 </td></tr> 
{/notempty} 


在 模板 中 使 用 getParentMenuTitle () 方法 ， 可 以 知道 当前 菜单 的 父 菜单 ， 在 application\common.php 中 定义 。 代 码 如 下 : 


function getParentMenuTitle ($pid) 
{ 

return Db::name('menu')->where(['id'=>$pid])->value('title') ?3? '--—'; 
E: 


在 浏览 器 中 访问 地 址 http://wangcmf.com/admin/menu/index.html， 效 果 如 图 9-21 所 示 。 


超级 管理 员 后 台 wangjialin 


菜单 列表 人 


% 系统 设置 


邓 单 列表 
ID 名 称 上 级 菜单 分 组 URL 地 址 状态 操作 
1 首页 一 一 Index/index E33 编辑 禁用 副 除 
16 用 户 — ~ User/index E3 编辑 禁用 副 除 
68 系统 — ~ Menwindex E3 编辑 禁用 删除 


9-21 菜单 管理 之 菜单 列表 


2. 修 改 菜单 状态 


在 管理 系统 中 ， 每 个 列表 基本 都 带 有 状态 的 迁移 操作 ， 如 启用 (禁用 ) 、 删 除 等 。 在 Admin 控 制 器 类 中 ， 定 义 全 局 的 状态 迁移 方法 可 以 提高 方法 的 复 用 性 。 其 核心 代码 如 下 : 


// 表 记录 变 更 状态 方法 


protected function setStatus ($model = null) 


if($model !== null) 
EE 
$id = input ('id'); 
$status = input('status'); 


if($id !== null && $status !== null) 
{ 
Smap = []; 
Smap['id'] = $id; 
$data[l'status'] = $status; 
$model->where ($map) ->update ($data); 
switch ($status) 
{ 
case -1 : 
Sthis->success (' 删 除 成 功 ! ') 7; 
break; 
case 1 : 
Sthis->success (' 启 用 成 功 ! ') 7 


break; 

case 0 : 
Sthis->success (!' 禁 用 成 功 ! ') ; 
break; 


} 
} 
Sthis->error (' 参 数 错误 ! ')，; 


子 控制 器 在 继承 Admin 类 时 ， 只 需 定义 调用 setStatus () 的 方法 ， 传 入 需要 修改 的 模型 和 1D 即 可 ， 无 须 每 次 都 


定义 程序 逻辑 。 在 Menu 控 制 器 中 新 增 方法 ， 代 码 如 下 : 


Re 
于 各 民用 大 本 证人 
* 
publicfunctionsetMenuStatus () 
{ 
// 会 话 菜 单数 据 初始 化 
session ('ADMIN MENU ] LIST' ,NULL); 
// 更 新 记录 状态 ” 


return$this->setStatus (Db: :name ('menu')); 


修改 菜单 状态 可 使 用 AJAX 提 交 操 作 。 在 定义 状态 变更 按钮 时 ， 给 超 链 接 增加 了 一 些 预定 义 样式 类 。 以 删除 按钮 为 例 ， 相 应 的 HTML 代 码 定义 如 下 : 


<a class="ajax-get confirm" href="javascript:;" .….> 删 除 </a> 


两 个 类 名 的 定义 结合 JavaScript 脚 本 和 AJAX 操 作 ， 实 现 以 下 效果 。 


“ ajax-get: 用 户 执行 单 击 操 作 后 ， 发 送 的 是 GET 类 型 的 AJAX 请 求 ， 而 非 页 面 直接 重 定向 。 这 样 做 可 以 在 页 面 不 刷新 的 情况 下 异步 完成 操作 ， 从 而 提高 用 户 体验 。 


“ confirm: 按钮 的 请 求 发 送 前 需要 用 户 进行 确认 ， 否 则 停止 发 送 ， 从 而 减少 了 误 操 作 的 概率 。 


在 根 目录 public/static/admin/js 目 录 下 修改 common.js 脚 本 文件 ， 增 加 以 下 代码 : 


$ (function(){ 
// 处 理 ajaxget 请 求 
$('.ajax-get') .click (function (){ 
vartarget; 
// 获 取 当 前 操作 的 按钮 对 象 
varthat=this; 
// 判 断 是 否 进行 确认 操作 
if($ (this) .hasClass('confirm'))1{ 
if(!confirm(' 确 认 要 执行 该 操作 吗 ?') ) { 
return false; 


} 


} 
// 获 取 以 属性 定义 的 请 求 地 址 
if((target=$ (this) .attz('ur1l7)))1{ 
// 使 用 POST 的 方式 发 送 AJAX 请 求 ， 可 以 修改 为 AJAX 或 者 GET 
$.post (target, {},function (data) { 
// 判 断 返 画 人 
if (data.code==1) 


7 六 生 让 有 URL 册 性 ， 则 提示 信息 的 同时 提示 马上 要 进行 跳 转 


if(data.url)t{ 


$('#showSuccessTips') .show() .find('p') .text (data. 
msg+' ,正在 执行 跳 转 http://www.hzcourse.com/resource/readBook?path=/openresources/teach ebook/uncompressed/17746/OEBPS/Text/...') 


}else{ 


// 只 显示 信息 ， 不 执行 其 他 操作 


$('#showSuccessTips') .show() .find('p') .text (data.msg); 


setTimeout (function (){ 
if(data.url){ 
window.location.href=data.url; 
}else{ 
window.location.reload(); 
} 
},1000); 
}else{ 
// 显 示 错 误 信息 


} 
// 固 定时 间 后 ， 根 据 按钮 是 否 拥有 URL 属 性 ， 进 行 页 面 的 重 定向 或 者 刷新 


$ ('#showErrorTips') .show() .find('p') .text (data.msg); 


// 进 行 页 面 的 重 定向 
setTimeout (function (){ 
if(data.url){ 
window.1location.href=data.url; 


} 
},1000); 


入 
return false; 


了 这 


因为 菜单 的 记录 具有 特殊 性 ， 不 同 层级 下 的 菜单 可 能 会 重 名 ， 所 以 在 Menu 控 制 器 中 定义 了 物理 删除 菜单 的 方法 ， 防 止 数据 重复 增加 。 代 码 如 下 : 


publicfunctiondel () 


{ 
if (request () ->isAjax()) 


$id=input ('id',0); 
if(!$id) 


{ 
$this->error (" 删 除 失败 ， 参 数 错误 ') 


} 

$map['id']=$id; 

$return=Db: :name ('menu') ->where ($map) ->delete (); 
if(!$return) 


. 
Sthis->error (' 数 据 库 操作 失败 ! '); 


会 话 菜单 信息 初始 化 
session(' ADMIN MENU TLS J 
$this->success(' 删 除 成 功 ! '); 
. 
$this->error (' 数 据 异常 ') ; 
} 


完成 后 ， 在 模板 文件 header.html 中 引入 common.js 文 件 。 代 码 如 下 : 


<script src="_ STATIC /admin/js/common.js"></script> 


在 菜单 列表 中 成 功 进行 状态 的 迁移 操作 ， 例 如 禁用 首页 菜单 ， 效 果 如 


加 9-22 所 示 。 


ID 名 称 上 级 菜单 分 组 URL 地 址 状态 操作 
1 首页 三 -- Index/index 编辑 启用 删除 


9-22 表 记 录 的 状态 迁移 


3 新 增 (编辑 ) 菜单 


在 Menu 控 制 器 中 新 增 菜单 方法 add () ， 代 码 如 下 : 


// 新 增 菜单 
public function add() 


// 判断 是 否 是 POST 

if (request () ->isPost () ) 

{ 
// 数据 获取 
$data = input ('post.'); 
// 数据 验证 
$validate = new MenuValidate () 7 
$result = $validate->check ($data); 
if(!$result) 


$this->error ($validate->getError ()); 


+: 
// 数据 写 入 


$data['status'] = 1; 
$insertId = Db::name('menu')->insert ($data); 
if ($insertId !== false) 


// 更 新 会 话 中 的 菜单 信息 
session('ADMIN MENU LIST' , NULL); 
$this->success(' 保 存 成 功 '); 


: 
$this->error (' 数 据 库 操作 失败 ') 
} 


// 显示 已 有 菜单 树 形 结构 

$this->assign('menus', $this->getMenuTreeList()); 
$this->assign('active url' , 'Menu/index'); 
return $this->fetch(); 


此 方法 把 新 增 菜 单 页 面 的 展示 和 处 理 定义 在 一 个 方法 内 ， 通 过 对 请 求 数据 是 否 为 POST (用 户 提交 ) 进行 判断 来 获取 提交 的 数据 。 在 数据 写 入 部 分 ， 先 使 用 ThinkPHP 5 自 带 的 Validate 验 证 类 进行 数据 
的 校 验 。 代 码 如 下 : 


$validate = new MenuValidate (); 
$result = $validate->check ($data); 
if(!$result) 


$this->error ($validate->getError ()); 
} 


随后 进行 数据 的 写 入 ， 同 时 清除 菜单 在 会 话 中 的 缓存 (防止 每 次 查询 的 ) 。 代 码 如 下 : 


// 更 新 会 话 中 的 菜单 信息 
Session ('ADMIN MENU LIST! : NULL); 
$this->success(' 保 存 成 功 '); 


而 在 新 增 菜单 的 展示 部 分 ， 为 了 方便 用 户 选 择 当前 菜单 的 父 级 菜单 而 把 所 有 的 菜单 处 理 为 树 形 结构 展示 ， 如 图 9-23 所 示 。 


URL 地 址 URL 地 址 


[ 
上 级 菜单 EE | 


首页 
用 户 
上 用 户 信息 
上 新 增 用 户 
排序 上 用 户 行为 
上 新 增 用 户 行为 
上 编辑 用 户 行 为 
上 保存 用 户 行为 
上 变更 行为 状态 
L 楚 田 会 吕 


分 组 


图 9-23 ”菜单 选择 的 树 形 结构 


获取 树 形 结构 菜单 的 方法 为 getMenuTreeList () 。 该 方法 的 定义 如 下 : 


大 大 


* 获取 树 形 结构 菜单 
private function getMenuTreeList () 


2 rt 

Smenus = ('Menu')~>select (); 

A De 

StreeObj = new Tre 

// 和 人 半 各 区 家 为 东 各 的 机 形 结 告 构 列表 

Smenus = $treeObj->toFormatTree ($menus); 

Smenus = array_merge ([['id'=>0, 'title_show'=>' 顶 级 菜单 '] ]，S$menus); 
return $menus; 


Tree 类 在 项 目 根 目录 下 的 extend (扩展 ) 目录 。 转 换 树 形 结构 方法 的 代码 如 下 : 


/** 
* 将 格式 数组 转换 为 树 
* @param array $list 
* @param integer $level 进行 递归 时 传递 用 的 参数 
* 
* 
Private function _toFormatTree ($list, $level=0, $title = 'title') { 
foreach ($list as $key=>$val) 
{ 
// 根据 菜单 的 层级 (第 一 级 还 是 第 二 级 ) 来 定义 前 面 有 几 个 空格 
S$tmp_str=str repeat ("&nbsp;", $level*2); 
S$tmp_str.="L"; 
$val[l'level'] = $level; 
$val['title show'] =$level==0?$val [$title]."&nbsp;":$tmp str.$val[$titlel]."gnbsp;"; 
// 判断 当前 的 菜单 是 否 有 子 菜单 〈_child 数 组 存放 ) ,没有 直接 把 当前 菜单 放 入 全 局 
菜单 变量 formatTree 
if(!array key exists(' child',s$val))t{ 
array push($this->formatTree, $val); 
Jelse{ 
$tmp ary = $val[' child']; 
unset ($val['_child']); 
array push ($this->formatTree, $val); 
// 进行 下 一 层 递 归 操 作 
$this-> toFormatTree ($tmp ary, $level+l, $title); 
* 
} 
return; 


} 


_toFormatTree () 常用 的 参数 有 两 个 ，$list 为 包含 所 有 菜单 的 一 维 数组 ，$level 指 定 菜单 的 层级 。 获 取 子 菜单 的 方式 ;为 递归 查询 方法 ， 代 码 如 下 : 


// 进行 下 一 层 递归 操作 
$this-> toFormatTree ($tmp ary, $level+1, $title); 


在 模板 目录 下 新 增 add.html， 表 单 使 用 AdminLTE 模 板 样式 ， 表 单 提交 部 分 的 代码 如 下 : 


<div class="box-footer"> 
<a href="javascript:history.back();" class="btn btn-default"> 返 回 上 一 级 
</a> 
<button type="button" target-form="form-horizontal" class="btn 
btn-info pull-right ajax-post"> 保 存 </button> 

</div> 


与 列表 状态 变更 操作 中 AJAX 预 定义 样式 类 ajax-get 类 似 ， 这 里 使 用 了 预定 义 类 ajax-post 来 定义 表单 的 无 刷新 提交 。 


在 项 目 public\static\admin\js 目 录 下 新 增 submit.js 脚 本 文件 ， 在 header.html 模 板 文件 中 引入 。 因 为 和 之 前 定义 ajax-get 处 理 方法 类 似 ， 这 里 仅 给 出 部 分 代码 : 


$ (function(){ 

$('.ajax-post') .click (function(){ 
// 获取 dom 对 象 
var self = $ (this); 
// 获取 表单 对 象 
Var form class = self.attr('target-form'); 
if(! form class) 
§ 

return false; 

} 
var form= $('.' + _form class); 
// 获取 表单 提交 的 地 址 
Var action = form.get(0) .action; 
if(! action) 


{ 


return false; 


} 

// 防止 重复 提交 

_self.text (' 正 在 提交 ') .attr('disabled' ，'disabled'); 
$ ('#showErrorTips') .hide () 7 

// ajax 提交 ， 提 交 表 单数 据 


$.post( action ，_form.serialize() , function (data){ 


最 后 测试 新 增 功能 ， 在 系统 下 增加 数据 库 管理 菜单 ， 如 图 9-24 所 示 。 


新 增 菜单 
标题 。 数据 库 备份 
S 系统 设置 


URL 地 址 Menu/index 


上 级 菜单 系统 


bie 


分 组 。 数据 库 管理 
菜单 管理 


排序 从 小 到 大 


Se 数据 库 管 理 
返回 上 一 级 | 保存 数据 库 备份 


9-24 ”在 系统 下 新 增 数据 库 管理 菜单 管理 


有 提示 : 编辑 菜单 操作 与 新 增 菜单 操作 类 似 ， 区 别 在 于 展示 数据 查询 与 数据 更 新 ， 具 体 可 以 参考 源 代 码 。 


第 10 章 ”内容 管理 框架 实战 一 配置 和 权限 管理 


在 第 9 章 中 介绍 了 开发 一 个 实 
习 后 ， 开 发 者 就 可 以 定制 自己 的 内 容 管 理 框架 ， 并 根据 实际 项 目 进 行 相应 的 调整 。 


10.1 配置 管理 


配置 管理 的 实现 步 又 跟 菜单 管理 类 似 ， 管 理 后台 可 以 对 配置 项 进行 管理 。 在 开发 过 程 中 ， 使 


10.1.1 程序 与 数据 结构 设计 


的 内 容 管 理 框架 需要 有 哪些 基本 模块 ， 同 时 也 实现 了 程序 框架 的 搭建 、 


ThinkPHP 框 架 自 带 的 config () 方法 ， 可 以 随时 读 取 配置 文件 中 的 配置 项 并 使 用 。 


户 登录 和 菜单 管理 等 基础 功能 。 本 章 将 继续 介绍 后 续 内 容 : 配置 管理 与 权限 管理 。 完 成 本 章 的 学 


配 


在 网 站 系统 设计 中 ， 配 置 项 的 使 用 无 处 不 在 ， 从 分 页 默认 显示 页 数 到 站 点 关键 字 ， 都 需要 使 
件 部 分 代码 如 下 : 


// 应 用 命名 空间 

'app_namespace' => 'app', 
// 应 用 调试 模式 

"app debug' => true, 
// 应 用 Trace 

'app trace' => false, 
// 应 用 模式 状态 

"apP_status' = 4 


项 进行 管理 。ThinkPHP 5 框架 级 别 的 配置 信息 存储 在 各 个 模块 下 的 config.php 文 件 中 ， 如 全 局 配置 文 


配置 项 存储 在 config.php 文 件 中 ， 无 法 满足 及 时 更 新 的 需求 ， 所 以 存储 在 MySQL 数 据 库 中 更 加 合适 。 在 内 容 管理 框架 中 ， 实 现 配 置 管理 的 配置 模块 与 菜单 模块 类 似 ， 功 能 如 图 10-1 所 示 。 


配置 项 存储 的 格式 与 文件 配置 中 的 格式 一 样 ， 都 是 键 值 对 形式 ， 所 以 表 设 计 并 不 复杂 。 不 过 MySQL 不 支持 原生 的 PHP 数 组 格式 ， 所 以 若 配 置 的 值 是 数组 ， 就 需要 PHP 进 行 解析 操作 。 新 增 配 置 表 


(db_config) 字段 说 明 如 表 10-1 所 示 。 


图 10-1 
表 10-1 
列 类 型 
id int(10) 
name varchar255 
value longtext 
status tinyint(4) 
create time int(10) 
update time int(10) 
type tinyint(2) 
10.1.2 ”配置 列表 管理 
继续 使 用 第 9 章 中 的 wangcmf 硕 目 ， 扩 展开 发 内 容 管理 框架 ， 展 示 配置 管理 的 实现 流程 。 


1. 新 增 控制 器 方法 


配置 模块 相关 功能 
配置 表 字段 说 明 


主键 自 增长 

配置 名 

配置 值 

状态 -1: 删除 ，0: 禁用 ，1: 正常) 
创建 时 间 

更 新 时 间 


配置 类 型 (0: 字符 串 ，1: 数组 ) 


在 application\admin\controller 目 录 下 ， 新 增 Config.php 配 置 控制 器 文件 ， 继 承 自 Admin 控 制 器 ， 新 增 index () 方法 ， 进 行列 表 的 展示 ， 代 码 如 下 : 


class Config extends Admin 
大 大 
* 配置 列表 展示 
* Qreturn mixed 
* @throws \think\exception\DbException 
让 
Public function index() 
// 构造 查询 条 件 
Smap = []; 
$map['status'] = ['egt' , 0]; 
// 查询 分 页 数据 
$list = Db::name('config')->where ($map) ->order ('create time desc')->paginate (10); 
if($1list) 


// 变量 置换 
$this->assign(' list' , $list); 
} 
// 模板 输出 泻 染 


return $this->fetch(); 


2 新 增 模板 文件 


随后 在 application\admin\view 目 录 下 ， 新 增 config 目 录 和 index.html 模 板 文件 。 列 表 循环 的 核心 代码 如 下 : 


{notempty name="_list"} 
{volist name=" list" id="vo"} 
<tr> 

<td>{$vo.id}</td> 

<td>{$vo.name} </td> 

<td>{$vo.value}</td> 

<td>{$vo.create time|time format}</td> 

<td>{$vo.update time|time format}</td> 

<td>{$vo.statuslget status info}</td> 

<td> 
<a href="{:url('edit', ['id'=>$vo['id']])}"> 编 辑 </a> 
{if condition='$vo["status"] eq 0'} 


<a class="ajax-get" href="javascript:;" url="{:url 
('setConfigStatus', ['id'=>$vo['id'],'status'=>1])} 
"> 启用 </a> 
{else/} 
<a class="ajax-get" href="javascript:;" url="{:url 
('setConfigStatus', ['id'=>$vo['id'],'status'=>0])} 
"> 禁用 </a> 
{/if} 
<a class="ajax-get confirm" href="javascript:;" url="{:url 
('setConfigStatus', ['id'=>$vo['id'],'status'=>-1] ) }"> 删 除 </a> 
<*/te> 
</tr> 
{/volist} 
{else /} 
<tr><td colspan="6" class="text-center"> 暂 无 数据 </td></tr> 
{/notempty} 


其 中 ，time_format () 方法 是 为 了 把 时 间 戳 格式 化 为 标准 日 期 显示 ， 也 可 以 直接 使 用 系统 date () 方法 。 因 为 配置 管理 不 涉及 物理 删除 ， 所 以 在 Config 控 制 器 中 ， 定 义 状 态 变更 方法 
setConfigStatus () ， 代 码 如 下 : 


we 
* 表 记 录 状 态 迁 移 
ey 
public function setConfigStatus () 
{ 

return $this->setStatus (Db::name('config')); 
} 


3. 配 置 列表 展示 


在 配置 表 中 增加 两 条 默认 配置 项 ， 如 图 10-2 所 示 。 


L Modify id name value status create_ time | update time type 


口 绑 辑 |1 |SITES_NAME | 超级 管理 员 后 台 | 1 0 1510101126 |0 
中 编辑 |2 |USER_ADMIN 1 1 0 0 0 


图 10-2 在 配置 表 中 增加 两 条 默认 配置 项 


在 浏览 器 中 访问 地 址 : http://wangcmf.com/admin/config/index， 效 果 图 如 图 10-3 所 示 。 
配置 列表 < 
配置 列表 
ID 配置 值 创建 时 间 更 新 时 间 状态 操作 
1 SITES_NAME 超级 管理 员 后 台 1970-01-01 08:00 2017-11-08 08:32 编辑 禁用 删除 
2 USER_ADMIN 1 1970-01-01 08.00 1970-01-01 08.00 [ 正堂 | 编辑 茶 用 删除 


图 10-3 ”配置 列表 展示 样式 


10.1.3 ”配置 编辑 管理 


配置 编辑 管理 主要 包含 新 增 配 置 和 编辑 配置 两 个 部 分 。 


1. 新 增 配置 


当 新 增 配 置 的 时 候 ， 需 要 填写 配置 名 、 配 置 值 ， 还 得 选择 配置 值 的 类 型 ， 


(1) 新 增 配 置 模板 文件 


实现 步骤 如 下 。 


在 application\admin\view\config 目 录 下 ， 新 增 add.html 模 板 文 件 ， 表 单 代码 如 下 : 


<form class="form-horizontal" action="{:url('add')}" method="post"> 


<label for="" class="col-sm-2 control-label"> 


配置 名 
</label> 


<div class="col-sm-6"><!-- 控 制 INPUT 元 素 的 宽度 --> 
<input type="text" name="name" class="form- 


control" id="" placeholder=" 配 置 名 "> 
</div> 
</div> 


<div class="form-group"> <!-- 成 功 的 表单 项 ， 需 要 增加 has- 


success 预 定义 类 --> 


<label for="" class="col-sm-2 control-label"> 


配置 类 型 
</label> 
<div class="col-sm-6"><!-- 控 制 INPUT 元 素 的 
普通 : <input type="radio" name="type" 
Value="0" checked> 
数组 : <input type="radio" name="type' 
value="1"> 
</div> 
</div> 
<div class="form-group"> 


宽度 --> 


' clas 


" class="" 


<label for="" class="col-sm-2 control-label"> 


配置 值 </label> 
<div class="col-sm-6"><!-- 控 制 INPUT 元 素 的 


宽度 --> 


<textarea class="form-control" name="value" 


rows="10"></textarea> 
</div> 
</div> 


</div> 
<div class="box-footer"> 
<a href="javascript:history.back();" class="btn btn- 


default"> 返 回 上 一 级 </a> 


<button type="button" target-form="form-horizontal"™" 
class="btn btn-info pull-right ajax-post"> 保 存 </button> 


</div> 
«I .人 box-footer —-> 
</form> 


(2) 新 增 配置 方法 


在 Config 控 制 器 中 ， 新 增 add () 方法 ， 包 含 配置 的 页 面 泻 染 和 数据 库 入 库 操作 ， 代 码 如 下 : 


类 
* 新 增 配 置 
* @return mixed 


ei 


public function add() 


// 判断 请 求 类 型 是 否 是 POST 
if (request () ->isPost ()) 


// 初始 化 验证 类 


$validate = new ConfigValidate(); 
$result = $validate->check(input('post.')); 


{ 


if(!S$result) 


// 错误 信息 


提示 


Sthis->error ($validate->getError ()); 


} 

// 构造 数据 

$data = input ('post.'); 
$data[l'status'] = 1; 
$data['create time'] = time(); 
// 数据 入 库 


$insertId = Db::name('config')->insert ($data); 


if ($insertId) 
{ 


Sthis->success (' 操 作成 功 ' ,url ('config/index')); 


} 


$this->error( 


"数据 库 操作 失败 ') ; 


// 置换 当前 菜单 项 显示 地 址 
$this->assign('active url' ， 'Config/index'); 
return S$this->fetch(); 


在 上 述 代 码 中 ,使 


了 Config 验 证 类 来 进行 表单 数据 的 验证 ， 为 了 避免 


名 冲突 ， 命 名 空间 使 用 如 下 代码 : 


use app\admin\validate\Config as ConfigValidate; 


(3) 执行 新 增 配 置 操作 


在 浏览 器 中 访问 add () 控制 器 方法 ， 增 加 订单 状态 配置 项 ORDER_STATUS， 操 作 如 图 10-4 所 示 。 


配置 管理 编辑 
新 增 配 置 


配置 名 ORDER_STATUS 


配置 类 型 。 普通 : ”数组 : 。 


配置 值 1: 已 下 单 
2: 已 支付 
3: 已 发 货 
4: 已 收 货 
5: 已 评价 


10-4 新 增 数组 类 型 的 配置 项 


新 增 配 置 项 的 时 候 ， 在 填写 配置 值 时 ， 为 了 方便 PHP 解 析 字 符 串 为 数组 ， 格 式 需要 符合 以 下 要 求 : 
“ 第 一 维 数组 使 用 回 车 〈 换 行 符 ) 分 隔 。 
“ 第 二 位 数组 使 用 冒号 (英文 半角 状态 下 的 “: ”符号 ) 分 隔 。 


完成 以 上 内 容 ， 单 击 “ 保 存 ” 按 钮 ， 可 以 看 到 配置 项 已 经 成 功 增加 ， 如 图 10-5 所 示 。 


ID 配置 值 创建 时 间 


7 ORDER_STATUS 1: 已 下 单 2: 已 支付 3: 已 发 货 4: 已 收 货 5: 已 评价 2017-12-25 11:07 


图 10-5 在 列表 上 查看 新 增 的 配置 项 


2. 编 辑 配 置 


(1) 查询 配置 信息 


在 edit () 方法 中 ， 需 要 先 查 询 配置 项 是 否 存在 ， 再 进行 其 他 届 辑 操作 ， 代 码 如 下 : 


$id = input('id' ); // 获取 配置 id 
$map['id'] = $id; // 构建 查询 条 件 
$map['status'] = ['egt' , 0]; 

$info = Db: :name ('config')->where ($map) ->find() 7 

if ($info === null) 


S$this->error (' 参 数 错误 或 查询 为 空 ') ; 
i 
$this->assign('info' ,$info); 


(2) 更 新 时 间 


新 增 数 据 的 时 候 ， 需 要 写 入 create_time 字 段 值 ， 在 更 新 的 时 候 ， 别 忘记 写 入 update_time 字 段 值 ， 代 码 如 下 : 


// 构造 数据 

$data = input ('post.'); 

$data['update time'] = time(); 

Smap['id'] = $data['id']; 

// 数据 入 库 

S$updateReturn = Db::name('config')->where ($map) ->update ($data); 


10.1.4 ”配置 使 用 


ThinkPHP 5 框架 自 带 config () 方法 ， 可 以 直接 读 取 配置 文件 中 的 配置 项 ， 但 是 无 法 直接 读 取 MySQL 数 据 库 中 存储 的 配置 项 ， 所 以 这 里 需要 在 系统 初始 化 的 时 人 息 ， 自 定义 方法 ， 把 数据 库 中 配置 项 读 
取出 来 ， 然 后 合并 到 系统 的 配置 文件 中 ， 方 便 全 局 调用 。 其 流程 图 如 图 10-6 所 示 。 


图 10-6 合并 数据 库 配置 到 系统 配置 的 流程 


下 面 讲解 如 何 实现 合并 数据 库 配置 到 系统 配置 。 


1. 实 现 配置 读 取 类 


在 application\commonNcontroller 目 录 下 ， 新 增 Config.php 配 置 类 文件 ， 定 义 静 态 方法 lists () ， 查 询 所 有 存储 在 数据 库 中 的 配置 项 ， 代 码 如 下 : 


class Config extends Controller 
! J 

* 获取 数据 库 中 的 配置 列表 

* @return array 配置 数组 


Public static function lists(){ 
Smap = array('status' => 1); 
$data = Db::name('Config')->where ($map)->field('type,name, 


value') ->select (); 


$config = []7 
ifl($data && is array($data)){ 
foreach ($data as $value) { 
$config[$value['name']] = self::parse($value['type'], 
$value['value']); 


} 


return $config; 


因为 配置 项 有 字符 串 和 数组 两 种 ， 需 要 进行 格式 化 处 理 ， 代 码 如 下 : 


$config[$value['name']] = self::parse($value['type'], $value['value']); 


类 中 使 用 格式 化 处 理 方法 parse () ， 代 码 如 下 : 


xy 
* Q@param $type 配置 项 类 型 ，0: 字符 串 ，1: 数组 类 型 
* @param $value 配置 项 值 
* @return array|false|string[] 
private static function parse ($type, $value){ 
switch ($type) { 
case 1: // 解 析 数 组 
Sarray = preg_ split('/[,;\r\n]+/', trim($value, ",;\r\n"));// 
解析 一 维 数组 
if(strpos ($value, ':')){ 
$value = array(); 
foreach ($array as $val) {// 解析 二 维 数 组 
list($k, $v) = explode(':', $val); 
$value[$k] = $v; 


}elsel{ 
$value = S$array; 
} 


break; 


return $value; 


2. 合 并 数据 库 配置 到 系统 配置 


在 application\admin\controller\Admin.php 控 制 器 中 ， 修 改 _initialize () 初始 化 方法 ， 追 加 配置 合并 的 代码 逻辑 ， 代 码 如 下 : 


// 读 取 缓 存 中 的 配置 
$config = cache('DB CONFIG DATA'); 
// 判断 是 否 有 缓存 数据 
if(!$config) 
{ 
// 在 数据 库 中 读 取 所 有 的 配置 信息 
$config = Config::l1ists(); 
// 结果 写 入 缓存 中 
cache ('DB CONFIG DATA' , $config); 


二 


} 
// 数据 库 配 置 合并 到 系统 配置 
config ($config); 


为 了 测试 合并 和 数组 格式 解析 是 否 正常 ， 在 application\admin\controller\Config.php 控 制 器 中 ， 新 增 test () 方法 ， 代 码 如 下 : 


public function test() 
{ 


dump (config ('ORDER STATUS')); 


在 浏览 器 中 访问 地 址 : http://wangcmf.com/admin/config/test， 显 示 结果 为 如 下 数组 类 型 ,说 明 功 能 可 以 正常 使 用 。 


D:\www\wangcmf\thinkphp\library\think\Debug.php:165: 
array (size=5) 

1 => string ' 已 下 单 ' (length=9) 
2 => string ' 已 支付 ' (length=9) 
3 => string ' 已 发 货 ' (length=9) 
4 => string ' 已 收 货 ' (length=9) 
5 => string ' 已 评价 ' (length=9) 


最 后 ， 为 了 及 时 更 新 缓存 中 存储 的 数据 ， 需 要 修改 add () 、edit () 方法 ,代码 如 下 : 


// 数据 入 库 更 新 缓存 

cache ('DB_CONFIG DATA' , null); 

Sthis->success (' 拒 作成 功 ' ,url ('config/index')); 
保 Status () 方 法 如 下 : 


cache ('DB CONFIG DATA' , null); 
return $this->setStatus (Db::name('config')); 


此 时 若 删除 或 禁用 了 ORDER_STATUS 配 置 项 记录 ， 会 及 时 更 新 (清除 ) 缓存 ， 防 止 数据 不 同步 导致 的 潜在 问题 ， 如 图 10-7 所 示 。 


ID 配置 值 创建 时 间 更 新 时 间 状态 操作 


7 ORDER_STATUS 1 已 下 单 2 已 支付 3- 已 发 货 4: 已 收 货 5: 已 评价 2017-12-25 11:07 1970-01-01 08:00 编辑 启用 删除 


图 10-7 ”禁用 ORDER_STATUS 配 置 项 


完成 操作 后 ， 再 次 访问 地 址 : http://wangcmf.com/admin/config/test， 发 现 ORDER_STATUS 已 经 不 存在 ， 即 显示 结果 为 : 


D:\www\wangcmf\thinkphp\library\think\Debug.php:165:null 


10.3 ”权限 管理 一 一 角色 分 组 、 节 点 授权 与 用 户 模块 
在 了 解 了 基本 的 数据 结构 与 程序 设计 后 ， 本 节 开始 讲解 如 何在 内 容 管理 框架 中 ， 实 现 完整 的 权限 管理 。 


10.3.1 权限 角色 管理 


为 了 更 好 地 融入 现 有 的 内 容 管 理 框架 ， 权 限 模块 的 开发 主要 分 为 以 下 两 大 部 分 。 


: 权限 管理 : 权限 角色 、 用 户 授权 管理 功能 开发 等 。 


“ 权限 验证 : 权限 验证 类 开发 等 。 


先 来 看 如 何 实现 权限 角色 管理 功能 。 


1. 列 表 管理 


权限 角色 分 组 列表 的 管理 ， 与 菜单 、 配 置 模块 的 列表 类 似 ， 实 现 步骤 如 下 。 


(1) 新 建 后 台 权限 管理 控制 器 
在 application\adminNcontroller 目 录 下 ， 新 增 AuthManager.php 控 制 器 文件 ， 继 承 自 Admin 父 控制 器 类 。 


(2) 权限 角色 列表 管理 


权限 角色 分 组 列表 的 展示 ， 实 现 较为 简单 ， 直 接 查 询 数据 库 即 可 ， 在 AuthManager 控 制 器 中 ， 增 加 index () 方法 ， 代 码 如 下 : 


六 大 


* 权限 分 组 列表 

* Qreturn mixed 

A 

public function index() 

{ 
Smap['status'] = ['egt' ,0]; // 条 件 查询 
S$group list = Db::name('AuthGroup')->where( Smap )->paginate (10); 
S$this->assign(' list' ，S$group list);  // 变量 置换 


return $this->fetch(); 


在 application\adminNview 模 板 目录 下 ， 新 增 auth_manager 目 录 ， 在 其 中 新 增 index.html 模 板 文件 ， 核 心 代 码 如 下 : 


{notempty name=" list"} 
{volist name=" list" id="vo"} 
< 
<td>{$vo.id}</td> 
<td>{$vo.title} </td> 
<td>{$vo.description|default='--'} </td> 
<td>{$vo.statuslget status info}</td> 
<td> 
<a href="{:url('groupmanage', ['id'=>$vo['id']])}"> 节 点 授权 </a> 
<a href="{:url('user',['id'=>$vo['id']])}"> 用 户 授权 </a> 


<a href="{:url('edit' ['id'=>$vo['id']])}"> 编 辑 </a> 

{if condition='$vo["status"] eq 0'} 

<a class="ajax-get"href="javascript:;"url="{:url ('setGroupStatus', 
['id'=>$vo['id'], "status'=>1]) }"> 启 用 </a> 


{else/} 

<a class="ajax-get" lof " Javascript :7" url="{:url('setGroupSstatus', 
['id'=>$vo['id'], "status'=>0]) }"> 蔡 用 </a> 

{LEY 


<a class="ajax-get confirm" href="javascript:;" url="{:url 
('setGroupstatus', ['id'=>$vo['id'],'status'=>-1]) }"> 删 除 </a> 
</ted> 
</tr> 
{/volist} 
{else /} 
<tr><td colspan="5" class="text-center"> 暂 无 数据 </td></tr> 
{/notempty} 


在 列表 中 ， 定 义 了 节点 授权 、 用 户 授权 等 功能 菜单 ， 完 成 效果 如 图 10-15 所 示 。 


权限 分 组 列表 全 部 
配置 列表 


分 组 名 摘 述 


颇 认 用 户 组 系统 默认 的 用 户 角 色 组 节点 授权 用 户 授权 编辑 禁用 删除 


测试 用 户 测试 用 户 节点 授权 用 户 授权 编辑 禁用 删除 


自 定 义 权 限 分 组 管理 员 新 增 的 权限 分 组 节点 授权 用 户 授权 编辑 禁用 删除 


图 10-15 权限 分 组 列表 效果 
2. 新 增 和 编辑 权限 角色 分 组 


在 AuthManager 控 制 器 中 ， 新 增 add () 方法 ,负责 新 增 功能 页 面 的 泻 染 和 请 求 入 库 操作 处 理 ， 代 码 如 下 : 


Ea 
* 新 增 分 组 页 面 
public function add() 


if ($this->request->isPost ()) 


{ 
// 数据 获取 
$data = input ('post.'); 
// 数据 验证 
$validate = new AuthGroup (); 
$result = $validate->check ($data); 
if(!$result) 
{ 


} 
// 数据 写 入 
$data[l'status'] 
$gata[ 'module'] 
$data[l'type'] = 
$insertId = Dl 
if($insertId ! 
{ 
$this->success(' 保 存 成 功 ', url ('index')); 
} 


$this->error (" 数 据 库 操作 失败 ') ; 


Sthis->error ($validate->getError () ) 7 


Ts 
'admin'; 


name ('auth group')->insert ($data); 
false) 


} 
$this->assign('active url' , 'AuthManager/index'); 
return $this->fetch(); 


在 auth_manager 目 录 中 新 增 add.html 模 板 文件 ， 表 单 提交 核心 代码 如 下 : 


<form class="form-horizontal" action="{:url('add')}" method="post"> 
<div class="box-body"> 
lo EE => 
<div class="form-group"> 
<label for="inputTitle" class="col-sm-2 control-label"> 
分 组 名 
</label> 
<div class="col-sm-6"> 
<input type="text" name="title" class="form-control" id=" 
inputTitle" placeholder=" 标 题 "> 
</div> 
</div> 
<div class="form-group"> 
<label for="inputDesc" class="col-sm-2 control-label"> 
描述 
</label> 
<div class="col-sm-6"> 
<textarea class="form-control" cols="80" rows="5" id=" 
inputDesc" name="description"></textarea> 
</div> 
</div> 
</div> 
<!-- /.box-body --> 
<div class="box-footer"> 
<a href="javascript:history.back();" class="btn btn-default"> 
返回 上 一 级 </a> 
<button type="button" target-form="form-horizontal" class=" 
btn btn-info pull-right ajax-post"> 保 存 </button> 
</div> 
<!-- /.box-footer --> 
</form> 


新 增 角 色 分 组 如 图 10-16 所 示 。 


只 能 查看 ， 无 法 进行 新 增 、 编 辑 和 删除 操 从 


图 10-16 新 增 角 色 分 组 
编辑 角色 分 组 的 实现 流程 与 新 增 角色 分 组 类 似 ， 在 这 里 不 再 敖 述 。 
3. 权 限 角 色 分 组 节点 管理 


新 增 角色 的 权限 分 组 ， 需 要 选择 哪些 权限 及 节点 ， 操 作 界面 如 图 10-17 所 示 。 


权限 节点 管理 用 


首页 图 


删除 :四 ”禁用 :日 ”恢复 :日 ”新 增 :日 ”编辑 :日 ”保存 用 户 组 :日 ”授权 :四 ”访问 授权 :日 ” 成 员 授 权 : 罩 ” 解 除 授权 : 目 
保存 成 员 授 权 : 国 ”分 类 授权 : 四 ”保存 分 类 授权 :四 ”模型 授权 : 回 ” 保 存 模型 授权 : 加 


图 10-17 为 角色 分 组 设置 权限 节点 
在 程序 实现 上 ， 最 外 层 的 box 定 义 展示 的 是 一 级 菜单 ， 每 个 一 级 菜单 下 又 查询 出 二 级 菜单 和 三 级 菜单 。 管 理 员 为 某 个 角色 分 组 勾 选 权限 节点 ， 单 击 “ 保 存 ” 后 完成 权限 关联 。 实 现 步骤 如 下 。 
(1) 新 建 权限 角色 分 组 管理 方法 


在 AuthManager 控 制 器 中 ， 新 增 groupmanage () 方法 ， 代 码 如 下 : 


/x** 


* 分 组 节点 管理 
* @return mixed 
和 
public function groupmanage () 
{ 
Sthis->updateRules (); 
// 获取 分 组 ID 
Sgroup id = input ('id'); 
if(!$group id) 


E 
$this->error (' 未 查询 到 权限 分 组 '); 
} 
// 查询 分 组 信息 
$map['status'] = 
Smap['module'] = 
Smap['type'] = 1; 
if($group id) 
$map['id'] = $group id; 


$auth group = Db: :name ('AuthGroup') 


->where( Smap ) 
->field('id, id,title, rules') 


->find(); 
// 一 级 菜单 权限 节点 列表 
Smap = []; 
$map['status'] = 
$map['type'] = 2; 
$auth rules = Db::name('auth rule')->field!('id,name,type')->where 
($map)- ->column (' id' ,'name')? 


// 二 级 菜单 权限 节点 列表 

$this->assign('first rule list' ,$auth rules); 
Smap = []; 
$map['status'] = 
Smap['type'] = 1; 
$auth rules = Db::name('auth rule')->field!('id,name,type')->where 
($map)- lt id' , 'name')7 

Sthis- >assi n( "second . rule list' ,$auth _ rules) 7 

]7 要 单 节点 列表 

te node list' ,S$this->returnMenuNodes()); 


// 当前 角色 分 组 权限 节 不 列表 


$this->assign('auth group nodes' , explode(',' , $auth group 
['rules'])) 

// 菜单 高 亮 

$this->assign('active url' , 'AuthManager/index'); 


return $this->fetch(); 


首先 调用 了 updateRules () 方法 ， 实 现 菜单 表 (db_menu) 和 权限 节点 表 (db_auth_rules) 数据 的 同步 ， 代 码 如 下 : 


* 通过 菜单 更 新 节点 数据 


* Qreturn bool 


六 
/ 
public function UpdateRules Of 
// 需 要 新 增 的 节点 必然 位 节点 
$nodes Sthis->returnMenuNodes (false); 
// 查询 现在 的 节点 规则 
Smap['module'] = 'admin'; 
Smap[ type’] = Ein yt] 
Srules Db: :name ('auth rule')->where ($map) ->order ('name ') -> 
select () 
We 更 新 的 新 节 
$data = []; 


foreach ($nodes as $value) 
{ 
$temp['name'] 
S$temp['title'] 


$value['url']; 
$value['title']; 


DEN 


$temp['module'] "admin'7 
$temp['type'] = 2; // 顶级 菜单 
if($value['pid'] > 0){ 
$temp['type'] = 1; // 一 般 URL 
} 
$temp['status'] = 1; 
$data[strtolower ($temp['name'].$temp['module'].$temp['type'])] = 
$temp; // 去 除 重复 项 
} 
Supdate = [];// 保 存 需 要 更 新 的 节点 
$igs [;// 保 存 需要 删除 的 节点 的 iQ 
工 


foreach ($ 
{ 


ules as $index=>$rule) 


$key = strtolower ($rule['name'].$rule['module'].$rule['type']); 


if ( isset($data[Skey]) ) { i // 如 果 数 据 库 中 的 规则 与 配置 的 节点 匹配 ,说 明 是 需要 更 新 的 节点 
$data[$key]['id'] = $rule['id'];  // 为 需要 更 新 的 节点 补充 id 值 
Supqate[] = $data[$key]; 


unset ($datal[l$key]); 
unset ($rules[$index]); 
unset ($rule['condition']); 
$diff[$rule['id']]=$rule; 
}elseif ($rule['status']==1){ 
$ids[] = S$rule['id']7 
} 


/ 是 否 有 更 新 的 节点 数据 
人 ( count ($update) ) { 
foreach (Supdate as $k=>$row){ 
if ( $row != $diff[$row['id']] ) { 
Db: :name ('auth rule')->where([ 'id'=>$row['id']])->update ($row); 


} 


/ 是 否 有 需要 删除 的 节点 数据 


从 ( count ($ids) ) { 
Db::name(" oo rule')->where( array.( ee 
(',',$ids)) ) )->update (array('status'=>-1) 


7 各 除 贡 机 是 是 机 TT 污秽 则 


是 否 有 新 增 的 节点 数据 
"Count (Sdata) ){ 
foreach ($data as $value) 
{ 
Db: :name ('auth rule')->insert ($value); 
. 
} 


return true; 


回 到 groupmanage () 方法 ,根据 type 值 的 不 同 ， 查 询 两 组 权限 节点 列表 ， 代 码 如 下 : 


// 一 级 菜单 权限 节点 列表 


Smap = []; 

$map['status'] = 

Smap['type'] = 2; 

$auth rules = Db::name('auth rule')->field('id,name,type')->where 
($map) ->column ('id' ，"name') 7 


// 二 级 菜单 权限 节点 列表 


$this->assign ('first rule list' ,$auth rules); 


Smap = []; 

$map['status'] = 1; 

Smap["type"] = 1; 

$auth rules = Db::name('auth rule')->field('id,name,type')->where 
($map) ->column ('id' ,'name'); 


$this->assign('second rule list' ,$auth rules); 


在 页 面 泻 染 前 ， 查 询 所 有 的 菜单 节点 和 当前 角色 分 组 所 拥有 的 节点 信息 ， 随 后 变量 置换 到 模板 中 去 : 


// 所 有 节点 列表 
$this->assign('node list' ,$this->returnMenuNodes ()); 
// 当前 角色 分 组 拥有 的 私 限 节点 列表 


$this->assign('auth group nodes' , explode(',' , $auth group['rules'])); 


其 中 获取 格式 化 的 菜单 列表 returnMenuNodes () 方法 ， 定 义 如 下 : 


大 大 


* 获取 菜单 权限 节点 


* @param bool Stree 
* @return array|false|mixed|\PDOStatement |string|\think\Collection 


*/ 
protected function returnMenuNodes (Stree = true){ 
static $tree nodes = array(); 
if ( $tree && !empty($tree nodes[(int)$tree]) ) { 


return Stree_nodes [Stree]7 


if((int)$tree){ 
$1list = Db::name('Menu')->field('id,pid,title,url,tip,hide')-> 


order ('sort asc')->select (); 
foreach ($list as $key => $value) { 
if( stripos($value['url'],MODULE NAME) !==0 ){ 
$list[$key] ['url'] = MODULE NAME.'/'.$value['url']; 


} 
$nodes = list to tree ($list, $pk='id', $pigd="'pid', $chilg=" 
operator', $root=0); 
foreach ($nodes as $key => $value) { 
if(!empty ($value['operator'])){ 
$nodes[$key] ['child'] = $value['operator']; 


unset ($nodes[$key] ['operator']); 


» 
}elsel{ 
$nodes = Db::name('Menu')->field('title,url,tip,pid')->order 
('sort asc')->select (); 
foreach ($nodes as $key => $value) { 
if( stripos($value['url'],MODULE NAME)! 
$nodes[$key] ['url'] = MODULE NAME. 


= jt 
.$value['url']; 


} 
} 


. 
$tree nodes[ (int) $tree] 
return $nodes; 


= $nodes; 


合并 菜单 节点 到 权限 节点 表 的 流程 如 图 10-18 所 示 。 


图 10-18 合并 菜单 节点 到 权限 节点 表 


(2) 新 建 权限 角色 分 组 管理 模板 


在 auth_manager 模 板 目录 下 ， 新 增 groupmanage.html 模 板 文件 ， 实 现 权 限 节 点 的 展示 和 操作 ， 核 心 代码 如 下 : 


{volist name="node list" id="node"} 
<div class="box"> 
<div class="box-header with-border"> 
<h3 class="box-title">{$nogde.title}</h3> 


<!-- 判断 当前 权限 角色 分 组 是 否 包含 此 节点 --> 
<input class="node-check" type="checkbox" value="{$first rule list 


[$node['url']]}" name="rules[]" 
{if condition="in array( $node['id'] , $auth group nodes ) 


"}checked="checked"{/if}/> 


i ox-body"> 
<!-- 遍历 二 级 菜单 《权限 ) 节点 --> 
{notempty name="node.child"} 

{volist name="node.child" id="child"} 
<div class="row"> 

<div class="col-md-12"> 

<span class="node-title">{$child.title}</span> 

<!-- 判断 当前 权限 角色 分 组 是 否 包 含 此 节点 --> 

<input class="node-check" type="checkbox" value=" 

{$second rule list[$child['url']]}" name="rules[]" 
{if condition="in array( $child['id'] , $auth_ 
group_nodes )"}checked="checked"{/if}/> 


</div> 
</div> 
<div> 
<div class="col-md-12 node-row"> 
isset ($child['operator'])"} 
历 三 级 级 菜单 (权限 ) 节 点 --> 
{volist name="child.operator" id="item"} 
<span class="node-child" style="">{$item.title}: 
<input class="node-check" type="checkbox" 
name="rules[]" value="{$second rule list 


[$item['url']]}" 
{if condition="in array( $item['id'] , $auth group nodes )"}checked=" 
checked" {/if} 
/>g&nbsp; gnbsp; &nbsp; &nbsp; 
</span> 
{/volist} 
{/if} 
<div class="clear"></div> 
</div> 
</div> 
{/volist} 
{/notempty} 
</div> 
</div> 
{/volist} 


在 菜单 节点 列表 的 遍历 中 ， 菜 单 的 名 称 读 取 的 是 node list 的 数据 ， 


但 是 节点 的 id 则 读 取 rule_list 的 数据 ， 根 据 url 字 段 进 行 匹 配 ， 一 级 菜单 核心 代码 如 下 : 


<input class="node-check" type="checkbox" value="{$first rule list[$node 


['url']]}" name="rules[]" 


{if condition="in array( $node['id'] , $auth group nodes ) 


"}checked="checked"{/if}/> 


完成 以 上 步骤 后 ， 就 可 以 为 权限 角色 分 组 ， 增 加 相应 的 权限 节点 了 。 


10.3.2 ”用 户 授权 


当 完 成 权限 角色 分 组 和 节点 分 组 的 管理 开发 后 ， 就 可 以 继续 查看 如 何 建立 和 用 户 (db_user) 之 间 的 授权 关系 ， 实 现 步骤 如 下 。 


1. 用 户 管理 


户 管理 分 为 用 户 列表 展示 、 新 增 用 户 和 用 户 状态 迁移 等 几 部 分 ， 
户 输入 的 密码 进行 二 次 验证 ， 如 图 10-19 所 示 。 


因为 实现 步骤 与 菜单 管理 、 配 置 管理 等 类 似 ， 所 以 这 里 不 再 逐个 讲解 实现 的 步骤 。 需 要 注意 的 是 ， 在 实现 新 增 


户 功能 时 ， 需 要 对 


图 10-19 ”使 用 ThinkPHP 自 带 的 验证 规则 验证 密码 


此 时 可 以 使 用 ThinkPHP 中 的 Validate 验 证 类 ， 自 带 的 验证 规则 来 进行 验证 ， 步 骤 如 下 。 


(1) 定义 密码 输入 表单 项 


定义 两 个 密码 文本 框 ，name 属 性 分 别 为 password 和 password c 


onfirm， 其 代码 如 下 : 


<div class="form-group"> 
<label for="inputURL" class="col-sm-2 control-label"> 
密码 


千 
</label> 
<div class="col-sm-6"> 


<input type="password" name="password" class="form-control™ 


placeholder=" 请 输入 密码 "> 
</div> 
</div> 
<div class="form-group"> 
<label for="inputURL" class="col-sm-2 control-label"> 
确认 
</label> 
<div class="col-sm-6"> 


<input type="password" name="password confirm" class="form- 


control" placeholder=" 请 再 次 输入 密码 "> 
</div> 
</div> 


(2) 在 Validate 类 中 定义 验证 规则 


在 application\validate 目 录 下 ， 找 到 User 验 证 类 文件 ， 对 两 次 密 


码 验证 的 规则 如 下 : 


protected $rule = [ 
'name' => 'require|max:100', 
"mobile' => 'unique:user|require|regex:\d{11}', 
'password'=>'require|confirm|regex: [a-zA-20-9] {6,18}" 


也 


可 以 看 到 对 密码 (password) 的 验证 规则 最 多 ， 现 对 字段 的 几 个 


" require: 验证 字段 是 否 为 空 。 


验证 规则 说 明 如 下 : 


“ confirm: 验证 当前 字段 的 值 ， 是 否 和 名 为 password_confirm 文 本 框 的 值 相同 。 


“ regex: [a-zA-Z0-9]{6，18}: 正则 验证 ， 字 段 的 值 的 长 度 必须 是 6~18 位 ， 由 数字 和 英文 大 小 写 组 成 。 


2. 用 户 授 权 页 


在 权限 角色 分 组 列表 上 ， 增 加 用 户 授权 的 按钮 “用 户 授权 ”， 传 入 分 组 id， 代 码 如 下 : 


<a href="{:url('user', ['id'=>$vo['id']])}"> 用 户 授 权 </a> 


随后 在 模板 目录 auth_manager 中 ， 新 增 user.html 模 板 文件 ， 因 


为 只 需要 建立 用 户 id (user_id) 和 权限 分 组 id (group_id) 的 关系 ， 所 以 表单 只 需要 展示 一 个 


户 id 的 输入 框 即 可 。 


核心 代码 如 下 : 


<div class="form-group"> 
<label for="inputUID" class="col-sm-2 control-label"> 
用 户 UID 
</label> 


<div class="col-sm-6"> 
<input type="text" name="user id" class="form-control" id="inputUID" placeholder=" 用 户 UID"> 
</div> 
</div> 


3. 用 户 授权 处 理 


修改 application\admin\controller\AuthManager.php 文 件 ， 新 增 user () 方法 ,方法 定义 如 下 : 


// 用 户 授权 


public function user() 
IE ($this->request->isPost ()) 


$user id = input ('user id'); // 获取 用 户 id 
$group id = input ('group id'); // 获取 权限 角色 分 组 id 
if( empty ($user id) ){ 

S$this->error(' 参 数 有 误 '); 
2 
if(is numeric ($user id) ){ 

if (is agmin ($user id)) { // 判断 是 否 是 超级 管理 员 

Sthis->error (' 访 用户 为 超级 管理 员 ') ; // 超级 管理 员 不 需要 授权 


} 
// 查询 是 否 存在 当前 用 户 
if( !Db::name('user')->where(['id'=>$user id])->find() ){ 


$this->error(' 用 户 不 存在 '); 
} 


: 
if($group id) 
b 
// 查询 是 否 存在 当前 分 组 


S$group info = Db::name('auth group')->where(['id'=>$group_ 
id])->fingd(); 

if(!$group info) 

{ 


$this->error (' 分 组 信息 查询 错误 '); 


} 

// 查询 是 否 已 经 存在 权限 对 应 关系 

$data = []; 

$data['user id'] = $user ig; 

$data['group id'] = $group id; 

$access_ info = Db::name('auth group access')->where ($data)-> 
find(); 

if ($access info) 


$this->error (' 请 勿 重复 添加 '); 


} 
// 新 建 用 户 一 角色 权限 对 应 关系 
$insertId = Db::name('auth group access')->insert ($data); 
if ($insertId !== false) 
{ 
$this->success (' 添 加 成 功 '); 
} 
} 


$this->assign('active url' , 'AuthManager/index'); 
return $this->fetch(); 
} 


在 新 增 用 户 权限 角色 关系 前 ， 需 要 对 是 否 是 超级 管理 员 、 是 否 存在 分 组 用 户 等 进行 判断 ， 最 后 再 判断 是 否 已 经 添加 过 关系 ， 避 免 添 加 重复 的 数据 。 


实现 以 上 内 容 后 ， 给 某 个 分 组 添加 用 户 权限 的 操作 ， 如 图 10-20 所 示 。 


菜单 管理 名 


成 功 ! 
添加 成 功 ,正在 执行 跳 转 


用 户 授权 


用 户 UID 3 


返回 上 一 级 


图 10-20 ”给 用 户 增加 角色 分 组 权限 


第 11 章 ”Crontab 计 划 任 务 管理 


Crontab 是 Linux/UNIX 系 统 上 最 常用 的 计划 任务 管理 工具 。PHP 开 发 者 在 实际 项 目 中 会 经 常 使 用 到 该 工具 。 不 过 受 限于 实际 的 项 目 部 署 应 用 环境 ，Crontab 配 置信 息 的 编辑 多 由 专门 的 服务 器 维护 人 员 
操作 ， 项 目 使 用 者 想 要 自行 添加 和 编辑 ， 流 程 较 为 烦琐 。 


本 章 将 会 基于 内 容 管理 框架 ， 开 发 一 个 可 视 化 的 Crontab 计 划 任 务 管理 模块 ， 极 大 地 方便 了 开发 者 和 用 户 的 使 用 。 


11.1 常见 计划 任务 实现 方法 


在 实际 开发 中 ， 经 常会 遇见 有 计划 任务 需求 的 场景 ， 如 创建 但 未 支付 的 订单 ， 或 失败 需要 退 款 的 商品 等 ， 这 些 都 需要 定时 执行 某 些 操 作 。 类 似 的 场景 还 有 许多 。 本 节 主 要 讲解 常见 的 几 种 计划 任务 的 实 
现 方 法 。 


11.1.1 PHP 脚本 实现 计划 任务 


因为 PHP 脚 本 是 基于 浏览 器 运行 的 ， 在 关闭 浏览 器 后 程序 会 自动 终止 ， 同 时 程序 执行 的 最 大 时 间 默 认为 30 秒 ， 所 以 要 让 PHP 脚 本 实现 计划 任务 ， 就 需要 一 个 或 多 个 脚本 ， 不 依赖 浏览 器 的 动作 而 可 以 一 
直 执 行 。 下 面 给 出 常见 方法 。 


“ 脚本 执行 时 间 限 制 : 使 用 PHP 内 置 的 set_time_limit () 方法 可 以 实现 让 脚本 持续 执行 。 


:浏览 器 关闭 ， 程 序 不 终止 : 使 用 PHP 内 置 的 ignore_user_abort () 方法 ， 可 以 让 脚本 在 关闭 浏览 器 的 情况 下 可 以 继续 执行 。 
“ 脚本 定时 执行 : 为 了 不 让 PHP 提 前 结束 进程 ， 使 用 语言 内 置 的 无 限 循环 结构 和 sleep() 等 待 方法 可 以 让 脚本 定时 执行 ， 如 5 秒 执行 一 次 。 


这 里 给 出 一 个 简单 的 脚本 实例 ， 演 示 PHP 计 划 任 务 的 实现 过 程 。 新 建 task.php 脚 本 文件 ， 实 现代 码 如 下 : 


<?php 
ignore user abort () 7 
set time limit (0); 
$interval = 3; 
$number = 0; 


// 无 限 循环 
dof{ 
if($number < 10) 
// 定时 写 入 文件 
file put contents(_DIR _. 
time() ); 
Snumber = $number + 1; 


// 等 待 3 秒 


// 关闭 浏览 器 ，PHP 脚 本 也 可 以 继续 执行 
// 通过 set time limit (0) 可 以 让 程序 无 限制 地 执行 下 去 
// 每 阳 3 秒 运行 一 次 

// 计数 器 


// 执行 10 次 文件 写 入 操作 
'/log/10g_'.date('Ymd His').'.log' ， 


} 
Sleep ($interval); 
}while (true) 7 


在 上 述 代码 中 ， 实 现 了 循环 内 的 代码 每 3 秒 执行 一 次 ， 一 共 执行 10 次 的 计划 任务 (新 建 log 文 件 ) 。 注 意 脚本 头 文件 中 定义 的 两 个 系统 方法 ， 代 码 如 下 : 


ignore user abort (); 
set time limit(0); 


// 关 掉 浏览 器 ，PHP 脚 本 也 可 以 继续 执行 
// 通过 set_time_limit (0) 可 以 让 程序 无 限制 地 执行 下 去 


在 浏览 器 中 访问 task.php 脚 本 ， 可 以 发 现在 log 目 录 下 ， 会 自动 新 增 10 个 log 文 件 ， 如 图 11-1 所 示 。 


2018/1/3 
2018/1/3 
2018/1/3 
2018/1/3 
2018/1/3 
2018/1/3 
2018/1/3 
2018/1/3 旦 


log 20180103 020913.log 
log 20180103 020916.log 
log 20180103 020919.log 
log 20180103 020922.log 
log 20180103 020925.log 


四 


NS 


log 20180103 020928.log 
log 20180103 020931.log 
log 20180103 020934.log 
log 20180103 020937.log 
log 20180103 020940.log 


N 


AN 


和 和 税 咎 咎 咎 者 


明 


NY 


图 11-1 使 用 PHP 脚 本 实现 定时 写 入 文件 


不 过 使 用 这 种 方式 ， 若 更 新 了 PHP 文 件 内 容 ， 需 要 重启 PHP 进 程 才 可 以 使 计划 任务 生效 。 此 外 ， 若 出 现 程序 错误 或 者 内 存 溢出 ，PHP 当 前 运行 的 进程 也 会 被 终止， 


性 ,维护 起 来 并 不 方便 。 


11.1.2 “使 用 系统 级 别 的 计划 任务 工具 


2018/1/3 星期 三 
2018/1/3 星期 三 


故 使 用 这 种 方式 具有 极 大 的 不 稳定 


既然 使 用 PHP 脚 本 实现 计划 任务 ， 在 一 些 方面 不 是 很 理想 ， 那 么 借助 外 部 的 工具 就 是 更 好 的 选择 。 无 论 是 Windows 还 是 Linux 操 作 系 统 ， 都 有 完善 的 计划 任务 解决 方案 。 例 如 在 Windows 10 中 ， 在 控 


制 面板 中 ， 就 可 以 直接 找到 任务 计划 程序 并 管理 计划 任务 ， 使 用 起 来 较为 简单 ， 如 图 11-2 所 示 。 


图 任务 计划 程序 一 口 x 创建 基本 任务 向 导 b4 
文件 (Pi ”操作 (A) ”查看 (V) ”帮助 (H) 区 

- 
4 中 | 国 卓 而 | ss9 


》 国 任务 计划 程序 库 | 。 | 个 计划 程序 (本 地 ) 地 
| [EtaEERE | 连接 到 另 一 台 计 算 机 . 开始 (9: 2018/ 1/ 3 星 ~ 11:06:42 二 口 路 时 区 同步 (Z) 
| R 加 ~ 站 发 吕 
[六 可 以 有 Esl 民 司 创建 基本 任务 .. | E 
| | 序 来 创建 和 管理 计算 a 每 日 每 后 CO: 个 | 天 半生 -次 
ET 
oe 
| 国 显示 所 有 正在 运行 的 任务 
司 启用 所 有 任务 历史 记录 
| AT 服务 帐户 配置 
在 近 24 小 时 a 查看 » 
接 要 : 总 计 0 个 - 0 个 正在 运行 .。 加 网 新 
目 帮助 


上 次 剧 新 时 间 : 2018/1/3 星期 三 10:46:38 


0 | [Fw 


11-2 在 Windows 系 统 中 管理 计划 任务 


不 过 基于 PHP 的 项 目 ， 一 般 部 署 在 Windows 服 务 器 上 的 较 少 ， 故 PHP 开 发 者 最 常用 的 还 是 Linux 系 统 中 的 Crontab 计 划 任 务 命令 工具 。 为 了 方便 演示 ， 这 里 使 用 vagrant 工 具 ， 在 本 地 搭建 Ubuntu 的 虚 
拟 机 系统 ， 登 录 成 功 后 ， 执 行 以 下 命令 查看 Crontab 的 帮助 信息 。 


crontab -~h 


结果 如 下 : 


vagrant@scotchbox:~$ crontab -h 
crontab: invalid option -- 'h' 
crontab: usage error: unrecognized option 
usage: crontab [-u user] file 


rontab | =w user ] [ =i 1 { “8 | -1 |-=r} 
(default operation is replace, per 1003.2) 

-e (edit user's crontab) 

-1 (list user's crontab) 

a (delete user's crontab) 

a (prompt before deleting user's crontab) 


也 可 以 执行 以 下 命令 ， 查 看 管理 员 用 户 (root) 有 哪些 计划 任务 。 


crontab -1 


执行 结果 如 下 : 


vagrant@scotchbox:~$ sudo crontab -1 

# Edit this file to introduce tasks to be run by cron. 
For example, you can run a backup of all your user accounts 
at 5 a.m every week with: 
0 5 * * 工 tar -zcf /var/backups/home.tgz /home/ 


mh dom mon dow command 

* * wx yx yw /usr/bin/php7.0 /var/www/wangcmf/public/cron.php 

* * wx yx /usr/bin/php7.0 /var/www/wangcmf/public/index.php crontab/ 
Crontask/index 


# 
# 
# 
# 
# For more information see the manual pages of crontab (5) and cron(8) 
# 
# 
# 
四 


其 实 无 论 使 用 哪个 计划 任务 工具 ， 都 是 为 了 实现 在 特定 的 时 间 执 行 某 项 任务 这 样 的 功能 ， 开 发 者 可 以 根据 实际 的 需求 选择 不 同 的 工具 。 


11.2 Crontab 入 门 


Linux 上 的 Crontab 计 划 任 务工 具 ， 没 有 可 视 化 的 交互 界面 ， 配 置 与 使 用 该 工具 都 需要 在 命令 行 下 操作 ， 本 节 主 要 讲解 Crontab 工 具 的 一 些 入 门 操作 。 


11.2.1 Crontab 使 用 教程 


在 讲解 之 前 ,需要 先 了 解 Cron 和 Crontab 的 区 别 。 经 常 使 用 到 的 Crontab 命 令 , 是 Cron 和 Table 合 体 的 简写 ， 它 其 实 是 Cron 的 配置 文件 ， 也 可 以 叫做 作业 列表 ， 开 发 者 可 以 在 里 面 定义 不 同 的 时 间 表 达 
式 ， 实 现 不 同 的 任务 需求 。 而 Cron 是 Linux 内 置 的 系统 进程 ，Cron 搭 配 Shell 脚 本 ， 就 可 以 执行 特定 的 计划 任务 。 


以 ubuntu16.04 为 例 ，Crontab 在 系统 中 多 个 地 方 都 有 配置 文件 。 
“ /var/spool/cron/crontabs: 该 目录 下 存放 的 是 每 个 用 户 的 Crontab 任 务 列表 ， 配 置 文件 的 名 称 与 用 户 名 一 致 。 
“ /etc/cron.d/: 存放 需要 执行 的 Crontab 文 件 或 脚本 。 
“ /etc/cron.hourly、/etc/cron.daily、/etc/cron.weekly、/etc/cron.monthly: 这 些 目录 中 的 脚本 ， 可 以 以 每 小 时 、 每 天 、 每 星期 和 每 月 为 单位 执行 一 次 。 


常用 的 命令 说 明 如 下 : 


crontab [-u username] // 省 略 用 户 表 表 示 操 作 当 前 用 户 的 Crontab 
-e (编辑 任务 列表 ) 
-1 ( 列 出 任务 列表 里 的 命令 ) 
< (删除 任务 列表 ) 


Crontab 的 命令 构成 为 : 时 间 表 达 式 + 操作 符 + 操 作 命 令 。 时 间 表达 式 的 构成 有 分 、 时 、 日 、 月 、 周 5 种 ， 操 作 符 有 以 下 几 种 : 


* : 取 值 范围 内 的 所 有 数字 。 
/ : 每 过 多 少 个 数字 。 

一 : 从 X 到 Z。 

，: 散 列 数字 。 


例如 ， 每 分 钟 执行 一 次 命令 showtime， 示 例如 下 : 


* * ww showTime 


每 天 晚上 11 点 30 执 行 某 个 PHP 脚 本 文件 ， 示 例如 下 : 


30 23 * * * /usr/bin/php7.0 /var/www/task.php 


时 间 表 达 式 的 定义 非常 灵活 ， 不 过 若 不 经 常 使 用 ， 极 易 导致 配置 错误 ， 这 里 推荐 使 用 在 线 的 Crontab 表 达 式 生成 器 ， 可 以 根据 需求 进行 定制 。 访 问 地 址 为 : http://www.pppet.net/ 访 问 后 使 用 效果 如 
图 11-3 所 示 。 


ron 泰 i 县 Cron 表 达 式 教程 常用 Cron 素 达 式 
秒 分 钟 小 时 日 月 周 年 
每 秒 允许 的 通配符 [, - * / 
图 周期 从 1 | -|2 人 种 
从 0 人 秒 开始 每 1 人 秒 执行 一 次 


00 国 o1 国 02 国 03 04 旧 05 国 06 国 07 国 08 国 09 
上 10 国 11 国 12 国 13 国 14 国 15 国 16 国 17 国 18 国 19 
20 国 21 国 22 国 23 国 24 国 25 国 26 国 27 国 28 国 29 
30 圆 31 国 32 国 33 国 34 国 35 国 36 国 37 国 38 国 39 
40 国 41 国 42 国 43 国 44 国 45 国 46 国 47 国 48 国 49 
50 国 51 国 52 国 53 国 54 国 55 国 56 国 57 国 58 国 59 


秒 


表达 式 字 段 : |1-2 
Cron 表达 式 : 1-2****?3 
最 近 5 次 运行 时 间 : 


2018-01-03 15:46:01 
2018-01-03 15:46:02 
2018-01-03 15:47:01 
2018-01-03 15:47:02 
2018-01-03 15:48:01 


11-3 ”在线 的 Crontab 表 达 式 生成 器 


11.2.2 ”用 Crontab 实 现 PHP 文 件 定时 写 入 


为 了 方便 演示 ， 这 里 实现 一 个 每 分 钟 写 入 文件 日 期 的 功能 。 首 先 在 系统 的 /var/www (Ubuntu 虚拟 机 环境 ) 目录 下 ， 新 增 log.php 脚 本 文件 。 具 体 代 码 如 下 : 


<?php 

file put contents(_DIR_.'/run.log', date('Y-m-d H:i:s')."\r\n", FILE_ 
APPEND); 

Ss 


此 脚本 每 次 执行 ， 都 会 生成 一 个 带 有 当前 时 间 信息 的 文件 ， 以 便 区 分 文件 是 何 时 创建 。 随 后 执行 以 下 命令 ， 给 当前 用 户 增加 Crontab 表 达 式 ， 指 定 何 时 执行 log.php 脚 本 : 


crontab -e 


增加 以 下 内 容 : 


* 太太 Jusr/bin/php7.0 /var/www/log.php 


保存 后 等 待 几 分 钟 ， 发 现在 /var/www 和 目录 下 ， 自 动 生成 了 run.log 文 件 ， 使 用 cat 命 令 查看 ， 内 容 如 下 : 


root@scotchbox:/var/www# cat run.log 
2018-01-03 16:01:01 
2018-01-03 16:02:01 
2018-01-03 16:03:02 


根据 Crontab 中 配置 的 时 间 任 务 表达 式 ，log.php 脚 本 每 隔 一 分 钟 都 会 被 执行 一 次 


， 而 此 时 修改 脚本 文件 ， 则 不 需要 重启 PHP 进 程 ， 修 改 的 代码 如 下 : 


<?2php 


file put contents( DIR_.'/run.log', 'time:'. 


"\r\n", FILE APPEND); 


> 


date('Y-m-d H:i:s'). 


经 过 几 分 钟 的 等 待 ， 再 次 查看 run.log 文 件 ， 发 现 已 经 写 入 了 新 的 格式 内 容 : 


2018-01-03 16:01:01 
2018-01-03 16:02:01 
2018-01-03 16:03:02 
2018-01-03 16:04:01 
time:2018-01-03 16:05:01 


通过 对 日 志 列表 细心 观察 可 以 发 现 ，Crontab 在 执行 的 时 候 ， 默 认 最 小 和 


哪 一 秒 执行 ， 修 改 时 间 表 达 式 如 下 : 


有 位 为 “分 ”， 并 且 会 从 第 1 秒 (根据 配置 文件 编辑 的 时 间 ， 误 差 在 2 秒 内 ) 开始 执行 。 开 发 者 还 可 以 通过 使 用 sleep 关 键 字 定义 在 


* **** sleep 20; /usr/bin/php7.0 /var/www/1og.Php 


sleep 后 面 的 参数 20 指 的 就 是 延迟 多 少 秒 执行 ， 等 待 几 分 钟 后 ， 再 次 查看 run.log 文 件 ， 发 现 文件 写 入 的 时 间 发 生 了 变化 : 


root@scotchbox: /var/www# cat run.log 
2018-01-03 16:02:01 

2018-01-03 16:03:02 

2018-01-03 16:04:01 

time:2018-01-03 16:05:01 
time:2018-01-03 16:06:01 
time:2018-01-03 16:07:01 
time:2018-01-03 16:08:01 
time:2018-01-03 16:10:21 
time:2018-01-03 16:11:21 


第 12 章 ”基于 Redis 队 列 的 商城 抢购 系统 


随 着 网 站 


办 法 ， 还 会 以 商城 抢购 模块 为 例 ， 使 


12.3 ”实现 简单 商城 网 站 


实现 抢购 系统 ， 需 要 一 个 较为 完整 的 商城 网 站 ， 但 因为 个 人 开发 者 


12.3.1 程序 设计 与 数据 库 设 计 


请 支付 较为 困 


此 这 里 把 下 和 


量 的 增多 ， 越 来 越 多 的 功能 模块 需要 应 对 高 并 发 、 高 流量 的 挑战 。 很 多 时 候 ，PHP+MySQL 这 样 的 简单 结构 已 经 无 法 满足 实际 需求 。 本 章 除了 讲解 一 些 高 并 发 应 用 场景 下 的 常见 问题 解决 
Redis 消 息 订阅 与 发 布 结构 实现 简单 的 抢购 模型 ， 为 处 理 多 人 抢购 商品 这 样 的 需求 提供 一 种 有 效 的 实现 途径 。 


a 成 功 与 支付 合并 ， 默 认 下 单 成 功 的 同时 模拟 支付 成 功 ， 下 面 来 看 实现 流程 。 


传统 的 商城 系统 ， 仅 仅 是 商品 类 型 就 不 只 一 种 ， 关 联 关系 非常 复杂 。 为 了 尽 可 能 地 简化 系统 的 复杂 度 ， 只 留 下 用 户 、 商 品 和 订单 模块 。 简 易 商城 系统 结构 导 图 如 图 12-19 所 示 。 


用 户 注 
用 户 登 录 
下 订单 操作 


订单 列表 


简易 商城 基于 内 容 管 理 框架 开发 ， 


“ 用 户 模块 : 除了 包含 用 户 注 册 、 登 录 外 ， 对 用 户 的 角色 进行 区 分 ， 普 通用 户 只 能 查看 和 购买 商品 ， 


“ 订单 模块 


“ 商品 模块 


根据 以 上 功 外 


示 。 


图 12-19 简易 商城 系统 结构 导 图 


相关 表 结 构 ， 其 几 个 功能 模块 简单 说 明 如 下 。 


: 除了 隐藏 的 下 单 逻辑 外 ， 在 页 面 展示 上 只 有 一 个 订单 列表 。 


: 包含 商品 列表 展示 、 商 品 详 情 展 示 和 隐 含 的 商品 购买 逻辑 。 


表 12-1 商品 表 字 段 说 明 


列 〈 字 段 ) 类 型 
id int(4) 自动 增 量 


商品 订单 表 与 商品 表 、 用 户 表 相关 联 ， 其 详细 的 字段 说 明 如 表 12-2 所 示 。 


表 12-2 商品 订单 表 字 段 说 明 


列 〈 字 上段) 类 型 


id int(4) 自动 增 量 


而 管理 员 还 可 以 发 布 商品 。 


设计 商品 表 (db goods) 和 商品 订单 表 (db_orders) 。 其 中 商品 表 中 ， 记 录 商 品 发 布 者 、 商 品名 称 和 商品 价格 等 基本 信息 ， 与 用 户 表 (db_user) 相关 联 。 其 表 字段 说 明 如 表 12-1 所 


释 
主键 自 增长 
前 品 名 称 


已 
30 


列 
型 

水 | 或 | 国 | 疏 
= 下 


型 
Bn 


x 


L 


品 更 新 时 间 


注 释 


订单 ID， 主 键 自 增长 


goods id int(10) 

user 1d int(10) 

order no varchar(255) 
pay_price decimal(12,2) 
is_ pay tinyint(1) 
pay_time int(10) 

status tinyint(1) 


商品 ID， 一 个 订单 对 应 一 个 商品 


用 户 ID 
订单 号 


实际 支付 价格 
是 否 已 经 文 付 , 0 表示 未 文 付 , 1 表示 已 文 付 
支付 时 间 


create time int(10) 


update time int(10) 


12.3.2 ”商城 首页 


继续 使 用 wangcmf 项 目 ， 并 在 此 基础 上 进行 扩 


1. 全 局 模板 


全 局 模板 使 
几 个 模板 文件 ， 


Bootstrap 框 架 和 ThinkPHP 5 框架 的 模板 继承 ， 在 application\index\view 


分 别 对 应 头 部 、 菜 单 导航 、 全 局 布局 和 底部 几 个 页 面 区 间 。 使 用 方法 和 引入 AdminLTE 模 板 样 式 类 似 ， 这 和 


新 增 时 间 
更 新 时 间 


展开 发 。 商 城 应 用 使 用 applicationNindex 模 块 。 下 面 介 绍 首页 的 代码 实现 逻辑 。 


{include file="public/header" /} 
{include file="public/nav" /} 
<div class="container"> 


{block 


name="container"}{/block} 


</div> <!-- /container --> 
{include file="public/footer" /} 
{block name="script"}{/block} 


录 下 ， 新 增 public 公 共 模 板 ， 随 后 在 该 模板 


不 再 逐个 贴 


H 


DL 


录 下 新 建 header.html、nav.html、layout.html 和 footer.html 
中 的 layout.html 文 件 内 容 如 下 : 


2. 首 页 控制 器 与 视图 


在 applicationNindexNcontroller 目 录 下 ， 新 增 Index.php 控 制 器 文件 ， 随 后 新 增 _initialize () 方法 ， 进 行 配置 加 载 等 操作 。 代 码 如 下 : 


六 类 
* 初始 化 方法 
六 
protected function initialize() 
{ 
Parent:: initialize(); 
// 读 取 缓存 中 的 配置 
$config = cache('DB CONFIG DATA'); 
if(!$config) 


// 在 数据 库 中 读 取 所 有 的 配置 信息 
$config = Config::1ists ()7 
cache ('DB_ CONFIG DATA' , $config); 


} 
// 数据 库 配置 合并 到 系统 配置 
config ($config); 


随后 定义 index () 方法 ， 展 示 首 页 的 商品 列表 ， 代 码 如 下 : 


六 大 
* 商品 列表 
* @return mixed 
A 
public function index() 


// 查询 条 件 
$map['status'] = 1; 
// 商品 列表 〈 分 页 ) 
$this->assign(' list' , Db::name('goods')->where (Smap) ->paginate (6) ) 7 
return Sthis->fetch () 7 
} 


最 后 在 applicationNindex\view 目 录 下 ， 新 建 index 目 录 ， 然 后 在 该 目录 下 新 增 index.htm| 模 板 文件 。 首 页 商品 列表 展示 的 核心 代码 如 下 : 


{extend name="public:1layout" /} 
{block name="container"} 
<div class="row"> 
{volist name=" list" id="vo"} 
<div class="col-sm-6 col-md-4"> 
<div class="thumbnail"> 
<img src="{S$vo.image}" alt="http://www.hzcourse.com/resource/readBook?path=/openresources/teach ebook/uncompressed/17746/0EBPS/Text/..."> 
<div class="caption"> 加 
<h3>{$vo.name}</h3> 
<p> 售 价 :， 竺 {$vo.sell price} 元 库存 : <span class=""> 
{$vo.stock} /n> 


<p> 
® prefe"{:url (detail', [rid'=>8vo[ id]])}" 
class="btn btn-danger" role="button"> 马 上 购买 </a> 
</p> 
</div> 
</div> 
</div> 
{/volist} 


</div> 
<div class="row"> 
<nav aria-label="Page navigation"> 
<ul class="pagination"> 
{$_list->rengder () } 
</ul> 
</nav> 
</div> 
{/block} 


12.3.3 ”用 户 注册 、 登 录 


商城 系统 中 ， 商 品 在 用 户 未 登录 的 状态 下 一 般 无 法 购买 ， 所 以 用 户 注册 和 登录 是 必要 的 ， 下 面 来 看 用 户 模块 实现 的 步骤 。 


1. 用 户 注册 


在 applicationNindex\view 目 录 下 ， 新 增 user 目 录 ， 在 applicationNindexNcontroller 目 录 下 ， 新 增 User.php 用 户 控制 器 ， 新 增 reg () 方法 ， 代 码 如 下 : 


public function reg() 
{ 
if ($this->request->isPost ()) 


// 获取 用 户 提交 的 注册 信息 

$mobile = input ('mobile'); 

$username = input ('name'); 

S$password = input ('password'); 

S$repassword = input ('repassword'); 

$data = $this->request->param(); 

// 数据 效 验 

if(!$username || !$mobile || !$password) 
Sthis->assign ('error_ tips' ，' 请 输入 用 户 名 、 手 机 号 或 密码 ') ; 

于 

elseif ($password != $repassword) 

{ 
$this->assign('error tips' ，' 两 次 密码 不 一 致 '); 


elseif (Db: :name ('user')->where(['mobile'=>$mobile])->fingd()) 
: 


$this->assign('error tips' ，' 手 机 号 已 经 存在 '); 
. 
else 
{ 
// 注册 新 用 户 
$data['status'] = 1; 
$data['create tjme'] = time(); 
$data['password'] = sys md5 ($data['password']); 


unset ($data['repassword"']); 
$insertId = Db::name('user')->insert ($data); 
if ($insertId) 


// 注册 成 功 后 ， 自 动 跳 转 到 登录 界面 
S$this->redirect( 'User/login'); 


} 
// 用 户 注册 输入 的 信息 ， 蔡 换 到 注册 表单 中 
$this->assign('data' , $data); 
} 
return $this->fetch(); 
} 


在 application\index\view\user 目 录 下 ， 新 增 reg.html 模 板 文件 ， 用 户 注册 表单 的 核心 代码 如 下 : 


url('reg')}" method="post"> 
form-group"> 
<label for=""> 用 户 名 </label> 
<input type="text" name="name" valu 
['name']:''}" class="form-control™" i 
</div> 
<div class="form-group"> 
<label for=""> 手 机 号 </1label> 
<input type="text" name="mobile" value: 


isset ($data) ?$data 
" placeholder=" 用 户 名 "> 


{:isset ($data) ?$data 


['mobile']:''}" class="form-control" id="" placeholder=" 手 机 号 "> 
</div> 
<div class="form-group"> 

<label for=""> 密 码 </1abe1> 


<input type="password" name="password" class="form-control" id="" 
Placeholder=" 密 码 "> 


</div> 
<div class="form-group"> 
<label for=""> 再 次 输入 </1abel> 


<input type="password" name="repassword" class="form-control" id="" 
Placeholder=" 再 次 输入 密码 "> 
</div> 
<div>{$error tipsldefault="''}</div> 
<button type="submit" class="btn btn-default"> 用 户 注册 </button> 
</form> 


在 nav.html 公 共 模 板 目录 下 ， 用 户 登 录 的 入 口 代 码 如 下 : 


{if condition="!session('USER ID')"} 

<ul class="nav navbar-nav navbar-right"> 
<1i><a href="{:url('User/reg')}"> 注 册 </a></1i> 
<1i><a href="{:url('User/1ogin')}"> 登 录 </a></1i> 

</ul> 

{else/} 

<ul class="nav navbar-nav navbar-right"> 
<1i><a href="/">{:session('USER NAME')}</a></1i> 
<1i><a href="{:url('Index/order 1ist')}"> 我 的 订单 </a></1i> 

{if condition="session('USER ID') = intval (config 

('USER ADMIN'))"} 
<1I><a href="{:url('Index/add')}"> 发 布 抢购 商品 </a></1i> 

{/if} 
<1i><a href="{ :url('User/logout')}"> 注 销 登录 </a></1i> 

</ul> 
公庄)} 


需要 注意 的 是 ， 在 模板 中 对 用 户 是 否 是 管理 员 进行 了 判断 ， 而 且 必 须 是 超级 管理 员 才 可 以 进行 商品 发 布 ， 代 码 如 下 : 


{if condition="session('USER ID') 一 intval (config('USER ADMIN') 和 
<1i><a href="{:url('Index/add') } "> 发布 抢购 商品 </a><71i> 
{/if} 


访问 注册 页 ， 效 果 如 图 12-20 所 示 。 


2. 用 户 登 录 


图 12-20 ”商城 用 户 注 册页 


为 了 实现 用 户 登 录 的 功能 ， 继 续 修改 User.php 用 户 控制 器 文件 ， 新 增 login () 方法 ， 代 码 如 下 : 


* 用 户 登 录 
* @return mixed 
证 
Public function login() 


if ($this->request->isPost ()) 
fk 
// 接收 参数 


Smobile = input ('mobile'); 
Spassword = input ('password'); 


// 查询 用 户 手 机 号 和 密码 是 否 正确 


$userinfo = Db::name('user')->where(['mobile'=>$mobile,' 


password'=>sys_md5 ($password) ] ) ->find() 7 
if(!$mobile || !$password) 
{ 
S$this->assign('error tips' ，' 请 输入 手机 号 或 者 密码 ' ) 
} 
elseif (!$userinfo) 
‘ 
S$this->assign('error tips' ，' 用 户 名 或 者 密码 错误 '); 
上 
else 
// 用 户 信息 写 入 会 话 
session('USER ID' , $userinfo['id']); 
Session('USER NAME' , $userinfol['name']); 
// 页 面 重 定向 到 首页 
$this->redirect( 'Index/index'); 
. 


l 
return $this->fetch(); 
bE: 


在 application\index\view\user 目 录 下 ， 新 增 login.html 文 件 ， 用 


户 登录 表单 的 核心 代码 如 下 : 


<form action="{:url('login')}" method="post"> 
<div class="form-group"> 
<label for=""> 手 机 号 </label> 


<input type="text" name="mobile" class="form-control" id= 
Placeholder=" 手 机 号 "> 

</div> 

<div class="form-group"> 
<label for=""> 密 码 </label> 
<input type="password" name="password" class="form-control" id="" 
Placeholder=" 密 码 "> 

</div> 

<div>{$error tips|ldefault="''}</div> 

<button type="submit" class="btn btn-default"> 用 户 登 录 </button> 

</form> 


完成 后 ， 使 用 超级 管理 员 账号 登录 ， 可 以 看 到 页 面 头 部 显示 了 用 户 信息 和 商品 发 布 入 口 ， 如 图 12-21 所 示 。 


wangjialin 了 我 的 订 童 点 布 抢购 商品 注销 登 孙 


12-21 用 户 登 录 成 功 后 显示 信息 


3. 用 户 注销 


修改 User.php 控 制 器 文件 ， 增 加 logout () 方法 ， 实 现 注销 功能 ， 代 码 如 下 : 


六 
* 注销 登录 

本 

public function logout () 


{ 
// 销毁 会 话 登录 信息 
session('USER ID' ,null); 
session('USER NAME' ,null); 
S$this->redirect ('index/index'); 


完成 这 一 步 ， 就 实现 了 简单 的 用 户 注册 、 登 录 和 注销 功能 。 


12.3.4 商品 发 布 


商品 发 布 需要 记录 商品 的 名 称 、 价 格 和 库存 ， 其 中 库存 是 判断 用 户 是 否 还 可 以 抢购 的 重要 依据 。 另 外 ， 为 了 美观 性 ， 提 供 了 商品 图 片上 传 的 功能 。 


在 application\index\view\index 目 录 中 ， 新 增 add.html 模 板 文件 ， 增 加 商品 发 布 的 表单 代码 如 下 : 


<form action="{:url('add') }" method="post" enctype="multipart/form- 
data" > 
<div class="form-group"> 
<labe1> 商 品名 称 </1abel> 
<input type="text" name="name" value="" class="form-control"™ 
Placeholder=" 文 章 标题 "> 
</div> 
<div class="form-group"> 
<labe1> 商 品 价格 </label> 
<input type="text" name="sell price" value="" class="form-control" 
Placeholder="0.00"> 
</div> 
<div class="form-group"> 
<labe1> 商 品 库存 </1abel> 


<input type="text" name="stock" value="" class="form-control" 
Placeholder=" 库 存 不 能 少 于 0"> 
</div> 


<div class="form-group"> 
<labe1> 商 品 图 片 </label> 
<input type='file' name='image'> 
</div> 
<div class="form-group"> 
<labe1> 文 章 详情 </1abel> 
<textarea id="desc" name="desc" style="width:100%; height:200px; 
"></textarea> 
</div> 
<div>{$error tipsldefault="''}</div> 
<button type="submit" class="btn btn-default"> 发 布 商品 </button> 
</form> 


需要 注意 两 点 ， 这 里 使 用 了 原始 的 表单 上 传 ， 所 以 表单 头 需要 带 如 下 代码 : 


enctype="multipart/form-data"™" 


另外 ， 代 码 中 还 使 用 了 第 三 方 的 富 文本 编辑 器 ckeditor， 除 了 定义 带 有 ID 属 性 的 textarea 标 签 ， 还 需要 引入 相应 的 类 库 和 代码 ， 其 代码 如 下 : 


{block name="script"} 
<script src="_ STATIC /index/libs/ckeditor/ckeditor.js"></script> 
<script> 
CKEDITOR. replace ('desc'); 
</script> 
{/block} 


修改 application\index\controller\index.php 控 制 器 文件 ， 增 加 add () 方法 ， 代 码 如 下 : 


六 大 
* 发 布 商品 
* Qreturn mixed 
wd 
public function aqd () 
{ 
// 权限 限制 ， 只 有 超级 管理 员 才 可 以 发 布 商 品 
if(session('USER ID') != intval (config('USER ADMIN'))) 


$this->error (' 只 有 管理 员 才 可 以 发 布 商品 '); 


1 

// 判断 请 求 类 型 

if ($this->request->isPost () ) 
// 获取 请 求 的 商品 参数 
$data = Sthis->request->param() 7 
// 文件 上 传 


$image = Sthis->upload() 7 
// 基本 的 非 空 验证 
if(!$data['name'] ||!$data['sell price']|| !$qata['stock']) 
{ 

$this->assign('error tips' ， "字段 不 能 为 空 ') ; 
elseif(!S$image) 
时 


S$this->assign('error tips' ， "请 上 传 缩 略 图 ') ; 
} 
else 
{ 
// 写 入 数据 到 数据 库 中 
$data['image'] = $image; 
$data[l'status'] = 1; 
$data['create time'] = time(); 
$data['user id'] = session('USER ID'); 


$insertId = Db::name( ‘goods') ->insert ($data) 
if ($insertId) 
{ 
$this->redirect ('index/index'); 

} 

} 

return $this->fetch(); 

} 


除了 菜单 入 口 做 了 限制 ， 在 add () 方法 中 也 做 了 非 管理 员 不 能 发 布 商 品 的 限制 ， 代 码 如 下 : 


// 权限 限制 ， 只 有 超级 管理 员 才 可 以 发 布 商 品 
if(session('USER ID') != intval (config('USER ADMIN'))) 


$this->error (' 只 有 管理 员 才 可 以 发 布 商 品 '); 
} 


同时 使 用 了 ThinkPHP 5 内 置 的 文件 上 传 类 库 上 传 商品 图 片 ， 文 件 会 被 上 传 到 根 目录 下 的 public/uploads 目 录 下 。 代 码 如 下 : 


7 关 件 主 传 
$image = $this->upload(); 
xx 
人 件 止 伟 
* @return string 
a 
public function upload(){ 
// 获取 表单 上 传 文件 ， 例 如 上 传 了 001 .jpg 
$file = request ()->file('image'); 
// 移动 到 框架 应 用 根 目 录 /public/uploads/ 下 


if ($file){ 
$info = $file->move (ROOT PATH . 'public' . DS . 'uploads'); 
if($info){ 
return '/uploads/' . $info->getSaveName () 7 


Jelse{ 
// 上 传 失败 获取 错误 信息 
return $file->getError(); 
} 

} 


完成 开发 后 ， 尝 试 使 用 商品 发 布 功 能 完成 后 的 效果 如 图 12-22 所 示 。 


12.3.5 ”商品 详情 页 


在 首页 商品 列表 中 ， 单 击 “ 马 上 购买 ”按钮 ， 可 以 进入 商品 详情 页 。 修 改 Index.php 控 制 器 文件 ， 增 加 detail () 方法 ， 实 现 商品 的 查询 和 模板 泻 染 ， 其 代码 如 下 : 


售 价 : 


任天堂 Switch 


¥¥2399.00 元 库存 : 100 


蕊 上 购 头 


图 12-22 发布 抢购 商品 


六 
* 商品 详情 
* @return mixed 
uy 
public function detail () 


// 根据 商品 ID 查 询 详情 
$map['id'] = 
$info = 
if(!$info) 


input (id')? 
Db: :name ('goods') ->where ($map) ->find (); 


$this->error (' 参 数 错误 ! '); 


} 
// 商品 信息 变量 置换 


$this->assign('info' , $info); 


return $this->fetch(); 


在 application\index\view\index 


<div class="row"> 


录 下 ， 增 加 detail.html 模 板 文件 ， 增 加 以 下 代码 : 


<div class="col-md-2"></div> 


<div class="col-md-8"> 


<div class="page-header"> 
<h2>{$info.name}</h2> 


</div> 
<div> 
<div class="row"> 


<div class="col-md-6"> 


<div> 


<image width="100%" src="{$info.image}"/> 


</div> 
</div> 


<div class="col-md-6" > 
<div style="padding:20px;font-size:20px;"> 售 价 ，{$info. 
sell price}</div> 


id="goods_s 


<div styl 
<p> 提 万 
</div> 


padding:20px; font-size:16px; "> 库存: <span 
ck">{$info.stock}</span></div> 
adding:20px; font-size:12px;"> 
每 个 用 户 限购 一 件 </p> 


</div> 


</div> 


</div> 


<div style="padding:20px;"> 


</div> 


<a class="btn btn-danger" id="buynow"> 马 上 抢购 </a> 
</div> 


<div class="page-header"> 


<h4> 商 品 详情 </h4> 


</div> 
<div>{$info.desc}</div> 
</div> 
<div class="col-md-2"></div> 


完成 以 上 开发 工作 后 ， 访 问 商品 详情 页 ， 效 果 如 图 12-23 所 示 。 


全 提 示 : 商城 抢购 系统 的 架构 较为 简单 ， 开 发 者 可 以 根据 需求 进行 扩充 。 


抢购 


首 


济 


搜索 wangjialin 我 的 订单 发 布 抢购 商品 


任天堂 Switch 


售 价 : 2399.00 


库存 : 100 


是 示 : 每 个 用 户 限购 一 件 


马上 抢购 


商品 详情 


任天堂 Switch (日 语 : 二 于 下 一 叉 了 Vy 于 ， 英 语 : Nintendo Switch) 是 任天堂 出 品 的 电子 游戏 机 ， 于 2017 年 3 月 3 日 
在 日 本 、 北 美 、 欧 洲 和 香港 发 售 ， 同 年 12 月 1 日 在 韩国 与 台湾 发 售 。 拥 有 可 拆 逢 控制 器 和 可 分 高 式 主 机 ， 游 戏 载体 使 用 了 
专用 卡带 。 主 机 处 理 器 使 用 了 英 伟 达 走 制 的 Tegra X1 系 统 芯片 ， 这 是 任天堂 首次 采用 英 伟 达 的 系统 芯片 。[2] 开 发 期 中 的 主 
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